/* =========================================================
   CHEMICODE 72 — 시스템 화면 공통 디자인 (홈페이지 초안 기준)
   글꼴: 제목 Jalnan 2 / 본문 Jalnan Gothic / 영문 라벨 Diphylleia
   (사장님 PC에 설치된 글꼴을 우선 사용, 없으면 Noto Sans KR)
   ========================================================= */

:root{
  --green:#1A7353; --green-d:#145C42; --green-l:#E3F3EA; --mint:#9BFFF9;
  --ink:#111318; --ink2:#3A3F4B; --sub:#6B7280; --line:#E7E9EE; --line2:#D9DDE3;
  --bg:#FFFFFF; --bg2:#F5F6F8; --bg3:#EEF0F3;
  --M:#E11D48; --S:#D97706; --I:#2563EB; --G:#059669;
  --A:#2E9E4F; --C:#F5C000; --F:#E03131;
  --safe:#4C9F70; --safe-bg:#E3F3EA; --low:#E4572E; --low-bg:#FBEAE6; --warn:#B9820A; --warn-bg:#FDF0DC; --info:#2E86AB; --info-bg:#E4F1F6;
  --r-card:24px; --r-box:16px; --r-field:12px; --pill:999px;
  --shadow:0 12px 40px rgba(17,19,24,.06); --shadow-lg:0 24px 60px rgba(17,19,24,.10);
  --f-title:'CC Title2','Noto Sans KR',sans-serif;
  --f-body:'CC Body','Noto Sans KR',sans-serif;
  --f-en:'Diphylleia',serif;
}
*{box-sizing:border-box}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.en{font-family:var(--f-en);letter-spacing:.06em}
.muted{color:var(--sub)} .small{font-size:13px} .tiny{font-size:12px}
.num{font-variant-numeric:tabular-nums}

/* ---------- layout ---------- */
.page{min-height:100vh;display:flex;flex-direction:column}
.main{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:40px 32px 64px}
.main.narrow{max-width:880px}
.main.wide{max-width:1376px}
.main.form{max-width:960px}
.stack{display:flex;flex-direction:column;gap:24px}
.row{display:flex;gap:12px;align-items:center}
.between{justify-content:space-between}
.wrap{flex-wrap:wrap}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.span-2{grid-column:span 2}
.apply-main {flex: 1;display: flex;flex-direction: column;max-width:1280px;width: calc(100% - 64px);}
.apply-intro {text-align: center;}
.apply-intro h1 {font-size: 52px;line-height: 1.22;}
.apply-columns {grid-template-columns: minmax(0, 1fr) 380px !important;gap: 32px !important;align-items: start !important;}



@media (max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.main{padding:24px 16px 48px}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.span-2{grid-column:auto}h1{font-size:26px}}

/* ---------- page title ---------- */
.ptitle{display:flex;flex-direction:column;gap:8px;margin-bottom:28px}
.ptitle .en{color:var(--green);font-size:14px}
.ptitle p{color:var(--sub)}
.ptitle-row{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.ptitle-row .ptitle{margin:0}

/* ---------- card ---------- */
.card{background:#fff;border-radius:var(--r-card);padding:32px;box-shadow:var(--shadow)}
.card.flat{box-shadow:none;border:1px solid var(--line)}
.card.tint{background:var(--bg2);box-shadow:none}
.card-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.card-h h2{font-size:20px}
@media (max-width:720px){.card{padding:22px 18px;border-radius:20px}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;cursor:pointer;border-radius:var(--pill);padding:12px 22px;font-family:var(--f-body);font-size:15px;line-height:1.2;white-space:nowrap;transition:background .15s,box-shadow .15s,transform .05s}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--green);color:#fff}.btn.primary:hover{background:var(--green-d)}
.btn.secondary{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line2)}.btn.secondary:hover{box-shadow:inset 0 0 0 1.5px var(--ink2)}
.btn.dark{background:var(--ink);color:#fff}
.btn.ghost{background:var(--green-l);color:var(--green)}
.btn.danger{background:var(--low-bg);color:var(--F)}
.btn.text{background:none;color:var(--green);padding:6px 8px}
.btn.sm{padding:7px 14px;font-size:13px}
.btn.lg{padding:16px 30px;font-size:17px}
.btn.block{width:100%}
.btn[disabled],.btn.disabled{opacity:.45;pointer-events:none}
.btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- badges ---------- */
.badge{display:inline-flex;align-items:center;gap:4px;border-radius:var(--pill);padding:3px 10px;font-size:12px;line-height:1.5;white-space:nowrap;background:var(--bg3);color:var(--sub)}
.badge.green{background:var(--safe-bg);color:var(--safe)}
.badge.red{background:var(--low-bg);color:var(--low)}
.badge.amber{background:var(--warn-bg);color:var(--warn)}
.badge.blue{background:var(--info-bg);color:var(--info)}
.badge.dark{background:var(--ink);color:#fff}
.code{display:inline-flex;align-items:center;justify-content:center;min-width:40px;padding:3px 10px;border-radius:10px;background:var(--green-l);color:var(--green);font-family:var(--f-title);font-size:14px;letter-spacing:.02em}

/* ---------- forms ---------- */
.field{display:flex;flex-direction:column;gap:8px}
.field>label,.label{font-size:14px;color:var(--ink2)}
.field>label .req{color:var(--F);margin-left:2px}
.input,.select,.textarea{width:100%;border:1px solid var(--line2);background:#fff;border-radius:var(--r-field);padding:12px 16px;font-size:15px;outline:none;transition:border .15s,box-shadow .15s}
.input:focus,.select:focus,.textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(26,115,83,.12)}
.input[readonly],.input:disabled{background:var(--bg2);color:var(--sub)}
.input.error{border-color:var(--F)}
.select{appearance:none;background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="m6 9 6 6 6-6" stroke="%236B7280" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat right 12px center;padding-right:40px}
.textarea{min-height:120px;resize:vertical;line-height:1.6}
.help{font-size:12px;color:var(--sub)} .err{font-size:12px;color:var(--F)}
.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:15px}
.check input{appearance:none;width:20px;height:20px;border-radius:6px;border:1.5px solid #C5CAD3;background:#fff;display:inline-grid;place-content:center;margin:0;cursor:pointer}
.check input:checked{background:var(--green) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none"><path d="M5 12.5 10 17.5 19 7" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>') center no-repeat;border-color:var(--green)}
.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:28px;flex-wrap:wrap}

/* ---------- alerts ---------- */
.alert{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-box);font-size:14px;line-height:1.55}
.alert.info{background:var(--green-l);color:var(--green-d)}
.alert.warn{background:var(--warn-bg);color:#7A5600}
.alert.error{background:var(--low-bg);color:#9C2F17}
.alert b{font-weight:400;font-family:var(--f-title)}

/* ---------- toolbar / search ---------- */
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.search{display:flex;align-items:center;gap:8px}
.search .box{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line2);border-radius:var(--pill);padding:9px 16px;width:300px}
.search .box input{border:0;outline:0;flex:1;font-size:14px;background:none;min-width:0}
.search .box svg{flex:none}
@media (max-width:720px){.search,.search .box{width:100%}}

/* ---------- table ---------- */
.table-wrap{overflow-x:auto;border-radius:var(--r-box);border:1px solid var(--line)}
table.tbl{width:100%;border-collapse:collapse;font-size:14px;background:#fff}
.tbl th{background:var(--bg2);color:var(--sub);font-weight:400;text-align:left;padding:12px 14px;white-space:nowrap;font-size:13px;border-bottom:1px solid var(--line)}
.tbl td{padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
.tbl td.wrap{white-space:normal;min-width:220px}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr:hover td{background:#FAFBFC}
.tbl tr.on td{background:#F1FAF5}
.tbl .c{text-align:center}.tbl .r{text-align:right}
.tbl .w-check{width:44px}
.tbl .actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:nowrap}
.empty{padding:48px 16px;text-align:center;color:var(--sub)}
.empty .t{font-size:17px;color:var(--ink2);margin-bottom:6px}
.table-foot{display:flex;justify-content:space-between;align-items:center;margin-top:16px;flex-wrap:wrap;gap:12px}
/* 모바일: 표 → 카드 */
@media (max-width:720px){
  .table-wrap.stack-m{border:0;overflow:visible}
  .stack-m table.tbl,.stack-m .tbl tbody,.stack-m .tbl tr,.stack-m .tbl td{display:block;width:100%}
  .stack-m .tbl thead{display:none}
  .stack-m .tbl tr{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:10px;padding:8px 4px}
  .stack-m .tbl td{border:0;padding:6px 12px;display:flex;gap:12px}
  .stack-m .tbl td::before{content:attr(data-label);flex:0 0 84px;color:var(--sub);font-size:12px}
  .stack-m .tbl .actions{justify-content:flex-start}
}

/* ---------- pagination ---------- */
.pager{display:flex;gap:6px;align-items:center}
.pager a{min-width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:14px;color:var(--ink2)}
.pager a.on{background:var(--green);color:#fff}
.pager a:hover:not(.on){background:var(--bg3)}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:32px;transform:translate(-50%,20px);opacity:0;background:var(--ink);color:#fff;border-radius:var(--pill);padding:13px 22px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-lg);transition:.25s;z-index:90;font-size:15px}
.toast::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--mint)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- header ---------- */
.logo{display:flex;align-items:center;gap:10px;flex:none}
.logo img{height:30px;width:auto}
.logo .wm{font-family:var(--f-title);font-size:19px;color:var(--ink);letter-spacing:-.01em}
.logo .wm b{color:var(--green);font-weight:400}
.ham{display:none;width:42px;height:42px;border-radius:12px;border:0;background:var(--bg2);cursor:pointer}
.drawer-bg{position:fixed;inset:0;background:rgba(17,19,24,.4);opacity:0;pointer-events:none;transition:.2s;z-index:80}
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(300px,86vw);background:#fff;z-index:81;transform:translateX(-100%);transition:.25s;padding:20px;display:flex;flex-direction:column;gap:6px}
.drawer a{padding:12px 14px;border-radius:12px}.drawer a.on{background:var(--green-l);color:var(--green)}
body.drawer-open .drawer{transform:none}body.drawer-open .drawer-bg{opacity:1;pointer-events:auto}
@media (max-width:1080px){.hd-nav,.hd-right .hide-m{display:none}.ham{display:grid;place-items:center}}
@media (max-width:720px){.hd-in{padding:0 16px;height:64px;gap:10px}.hd-user{display:none}.logo .wm{font-size:16px}.logo img{height:24px}.hd-right{gap:6px}.hd-right .btn.sm{padding:6px 11px}}

/* ---------- footer ---------- */
.ft{border-top:1px solid var(--line);background:#fff}
.ft-in{max-width:1440px;margin:0 auto;padding:22px 32px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--sub)}
.ft-in .links{display:flex;gap:18px}

/* ---------- misc ---------- */
.kv{display:grid;grid-template-columns:120px 1fr;gap:10px 16px;font-size:15px}
.kv dt{color:var(--sub)} .kv dd{margin:0}
.divider{height:1px;background:var(--line);margin:24px 0}
.invite{display:flex;gap:8px;align-items:center;background:var(--bg2);border-radius:var(--r-box);padding:16px}
.invite .input{background:#fff}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.bar{height:10px;border-radius:999px;background:var(--bg3);overflow:hidden;position:relative}
.bar>i{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--green)}

/* core: 모달 · 시작 3D · 시연 도구 · 레이아웃 */
body{min-height:100vh;display:flex;flex-direction:column}
#app{flex:1;display:flex;flex-direction:column;min-height:100vh}
.page-body{flex:1;display:flex;flex-direction:column}
.cc-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;opacity:0;transition:opacity .18s}
.cc-modal.show{opacity:1}
.cc-modal-bg{position:absolute;inset:0;background:rgba(17,19,24,.45)}
.cc-modal-box{position:relative;background:#fff;border-radius:24px;padding:28px;width:100%;box-shadow:var(--shadow-lg);max-height:90vh;overflow:auto}
.intro3d{position:fixed;inset:0;z-index:300;background:#07090e;transition:opacity .9s ease,transform .9s ease}
.intro3d iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
.intro3d .skip{position:absolute;right:22px;bottom:22px;color:#cfd4e0;font-size:13px;letter-spacing:.08em;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:8px 14px;cursor:pointer;font-family:var(--f-body)}
.intro3d.out{opacity:0;transform:scale(1.05);pointer-events:none}
body.intro-on{overflow:hidden}
#demo{position:fixed;right:16px;bottom:16px;z-index:150;font-size:13px}
#demo .demo-toggle{border:0;border-radius:999px;background:var(--ink);color:#fff;padding:9px 16px;cursor:pointer;font-family:var(--f-body);box-shadow:var(--shadow-lg)}
#demo .demo-panel{display:none;position:absolute;right:0;bottom:46px;width:240px;background:#fff;border-radius:18px;box-shadow:var(--shadow-lg);padding:14px;flex-direction:column;gap:6px}
#demo.open .demo-panel{display:flex}
#demo .demo-panel button{border:0;background:var(--bg2);border-radius:10px;padding:9px 12px;text-align:left;cursor:pointer;font-family:var(--f-body);font-size:13px}
#demo .demo-panel button:hover{background:var(--green-l);color:var(--green)}
#demo hr{border:0;border-top:1px solid var(--line);margin:4px 0}
@media print{#demo,.toast,.no-print,.hd,.ft{display:none!important}}
/* 휴대폰: 시연 버튼이 답 버튼을 가리지 않게 위로 / 검색칸·표 카드 보정 */
@media (max-width:720px){
  #demo{bottom:auto;top:72px;right:10px}
  #demo .demo-toggle{padding:6px 12px;font-size:12px;opacity:.85}
  #demo .demo-panel{bottom:auto;top:40px}
  .search{width:100%}.search .box{flex:1;width:auto;min-width:0}
  .stack-m .tbl td.wrap{flex-wrap:nowrap;min-width:0}
}

/* =========================================================
   20 site — 홈페이지(피그마 메인) · 케미코드란 · 16가지 유형 · 조직 궁합 · 검사 신청
   ========================================================= */

/* ---------- 머리글 (피그마: 흰 바탕, 로고 왼쪽, 메뉴 오른쪽) ---------- */
.L-site .site-hd{background:rgba(255,255,255,.94);border-bottom:1px solid transparent;transition:border-color .2s}
.L-site .site-hd .hd-in{height:80px;padding:0 80px;gap:28px}
.L-site .site-hd .hd-nav{margin-left:auto;gap:6px}
.L-site .site-hd .hd-nav a{font-size:16px;color:var(--ink);padding:8px 16px}
.L-site .site-hd .hd-nav a:hover{background:transparent;color:var(--green)}
.L-site .site-hd .hd-nav a.on{background:transparent;color:var(--green);box-shadow:inset 0 -2px 0 var(--green);border-radius:0}
.L-site .site-hd .hd-right .btn.sm{padding:10px 20px;font-size:14px}
.L-site .page-body{background:#fff}
@media (max-width:1280px){.L-site .site-hd .hd-in{padding:0 32px}}
@media (max-width:1080px){
  .L-site .site-hd .hd-in{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:0;row-gap:4px;column-gap:10px}
  .L-site .site-hd .hd-nav{display:flex;order:3;width:100%;margin:0 -8px;overflow-x:auto;scrollbar-width:none}
  .L-site .site-hd .hd-nav a{font-size:14px;padding:10px 10px 12px}
  .L-site .site-hd .hd-right{margin-left:auto}
}
@media (max-width:720px){.L-site .site-hd .hd-in{padding:10px 16px 0}.L-site .site-hd .hd-right .btn.sm{padding:8px 13px;font-size:13px}}

/* ---------- 홈페이지 푸터 ---------- */
.L-site .site-ft{background:var(--ink);color:#C9CDD5}
.L-site .sf-in{max-width:1280px;width:calc(100% - 64px);margin:0 auto;padding:56px 0 40px;display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.L-site .sf-wm{font-family:var(--f-title);font-size:24px;color:#fff;letter-spacing:-.01em}
.L-site .sf-wm b{font-weight:400;color:var(--mint)}
.L-site .sf-brand p{margin-top:10px;font-size:14px;color:#9AA0AC}
.L-site .sf-cols{display:flex;gap:72px}
.L-site .sf-cols div{display:flex;flex-direction:column;gap:10px;font-size:14px}
.L-site .sf-cols b{font-family:var(--f-title);font-weight:400;color:#fff;font-size:15px;margin-bottom:4px}
.L-site .sf-cols a{color:#B4BAC5}.L-site .sf-cols a:hover{color:var(--mint)}
.L-site .sf-fine{max-width:1280px;width:calc(100% - 64px);margin:0 auto;padding:20px 0 28px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:#7D8492}
@media (max-width:720px){.L-site .sf-in,.L-site .sf-fine{width:calc(100% - 32px)}.L-site .sf-in{padding:40px 0 28px;gap:28px}.L-site .sf-cols{gap:36px;flex-wrap:wrap}}

/* ---------- 공통 ---------- */
.v-site{flex:1;background:#fff;color:var(--ink);word-break:keep-all;overflow-wrap:break-word}
.v-site .wrap{width:calc(100% - 64px);max-width:1280px;margin:0 auto}
.v-site .eyebrow{display:inline-block;font-size:14px;color:var(--green);letter-spacing:.08em;margin-bottom:12px}
.v-site .kicker{font-size:13px;color:var(--green);letter-spacing:.04em}
.v-site .arr{display:inline-block;transition:transform .2s}
.v-site a:hover .arr,.v-site button:hover .arr{transform:translateX(3px)}
.v-site .lnk{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.v-site .s-head{padding:88px 0 40px;text-align:center}
.v-site .s-head h1{font-size:52px;line-height:1.22}
.v-site .s-head .lead{margin-top:20px;font-size:19px;color:var(--sub);line-height:1.7}
.v-site .s-sec{padding:88px 0}
.v-site .s-sec.tight{padding:32px 0 88px}
.v-site .s-sec.grey{background:var(--bg2)}
.v-site .s-band{background:var(--bg2);padding:72px 0}
.v-site .band-in{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.v-site .band-in h2{font-size:36px}
.v-site .band-in p{margin-top:10px;color:var(--sub);font-size:16px}
.v-site .cc{display:inline-grid;place-items:center;font-family:var(--f-title);border-radius:16px;padding:14px 18px;font-size:22px;letter-spacing:.02em}
/* 순위 구간 색 (1~4위 / 5~8위 / 9~12위 / 13~16위) */
.v-site .t1{background:#E3F3EA;color:#1A7353}
.v-site .t2{background:#E4F0F8;color:#22628A}
.v-site .t3{background:#FBF1DB;color:#8A6410}
.v-site .t4{background:#FBEAEA;color:#A33A3A}
@media (max-width:720px){
  .v-site .wrap{width:calc(100% - 32px)}
  .v-site .s-head{padding:48px 0 24px}.v-site .s-head h1{font-size:29px}.v-site .s-head .lead{font-size:16px}
  .v-site .s-sec{padding:56px 0}.v-site .s-sec.tight{padding:20px 0 56px}
  .v-site .s-band{padding:48px 0}.v-site .band-in h2{font-size:26px}.v-site .band-in .btns{width:100%}.v-site .band-in .btn{flex:1;padding:14px 16px;font-size:15px}
}

/* =========================================================
   홈
   ========================================================= */
.v-site.home .h-top{position:relative;text-align:center;padding:96px 16px 72px;overflow:hidden}
.v-site.home .glow{position:absolute;left:50%;top:70px;width:900px;height:260px;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(155,255,249,.95) 0%,rgba(110,214,170,.55) 38%,rgba(26,115,83,.18) 62%,rgba(26,115,83,0) 74%);filter:blur(36px);opacity:.75;pointer-events:none;animation:ccs-glow 9s ease-in-out infinite alternate}
@keyframes ccs-glow{from{transform:translateX(-50%) scale(1)}to{transform:translateX(-50%) scale(1.08,1.15)}}
.v-site.home .h-title{position:relative;font-size:64px;line-height:1.15;letter-spacing:-.02em}
.v-site.home .h-title b{font-weight:400;color:var(--green)}
.v-site.home .h-lead{position:relative;margin-top:18px;font-size:20px;color:var(--ink2)}
.v-site.home .h-cta{position:relative;display:inline-flex;align-items:center;gap:18px;margin-top:36px}
.v-site.home .pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:15px 34px;font-size:17px;line-height:1.2;transition:background .15s,box-shadow .15s,transform .15s}
.v-site.home .pill.go{background:var(--green);color:#fff}.v-site.home .pill.go:hover{background:var(--green-d);transform:translateY(-1px)}
.v-site.home .pill.see{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2)}.v-site.home .pill.see:hover{box-shadow:inset 0 0 0 1px var(--ink2)}
.v-site.home .vdiv{width:1px;height:28px;background:var(--line2)}

/* 사진 블록 + 글자 등장 */
.v-site.home .h-photo{padding:8px 0 120px}
.v-site.home .ph{position:relative;height:640px;border-radius:16px;overflow:hidden;background:#1d2a25;isolation:isolate}
.v-site.home .ph .kb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 55%;animation:ccs-kb 28s ease-in-out infinite alternate}
@keyframes ccs-kb{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.16) translate(-1.5%,-1%)}}
.v-site.home .ph .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,14,18,.42),rgba(10,14,18,.58))}
.v-site.home .ph .txt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;padding:24px}
.v-site.home .ph .txt .en{color:var(--mint);font-size:16px;letter-spacing:.24em;margin-bottom:22px;opacity:0;transform:translateY(10px);transition:opacity .7s ease,transform .7s ease}
.v-site.home .ph h2{font-size:44px;line-height:1.45;letter-spacing:-.01em}
.v-site.home .ph .w{display:inline-block;opacity:0;transform:translateY(26px);filter:blur(6px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1),filter .7s ease;transition-delay:calc(var(--i) * 110ms + 250ms)}
.v-site.home .ph.in .txt .en{opacity:1;transform:none}
.v-site.home .ph.in .w{opacity:1;transform:none;filter:none}

/* MSIG 카드 */
.v-site.home .h-msig{padding:0 0 120px}
.v-site .sec-t h2{font-size:44px;line-height:1.25}
.v-site .sec-t p{margin-top:14px;font-size:19px;color:var(--sub)}
.v-site.home .cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:48px}
.v-site.home .mcard{display:block;color:inherit}
.v-site.home .mcard .im{position:relative;aspect-ratio:296/405;border-radius:40px;overflow:hidden;background:var(--bg3)}
.v-site.home .mcard .im img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.v-site.home .mcard:hover .im img,.v-site.home .mcard:focus-visible .im img{transform:scale(1.07)}
.v-site.home .mcard .lt{position:absolute;left:20px;top:20px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.88);font-family:var(--f-title);font-size:20px;color:var(--green);backdrop-filter:blur(6px)}
.v-site.home .mcard .ttl{margin-top:22px;font-size:30px;letter-spacing:.04em;color:var(--ink)}
.v-site.home .mcard p{margin-top:6px;font-size:18px;color:var(--sub);line-height:1.5}
.v-site.home .mcard:focus-visible{outline:2px solid var(--green);outline-offset:6px;border-radius:40px}

/* 나의 재무 행동 성향 코드 */
.v-site.home .h-code{padding:0 0 120px}
.v-site.home .two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,704px);gap:48px;align-items:center}
.v-site.home .two .tx h2{font-size:44px;line-height:1.25}
.v-site.home .two .tx p{margin:24px 0 36px;font-size:22px;color:var(--sub);line-height:1.65;max-width:480px}
.v-site.home .two .vis{aspect-ratio:1/1;border-radius:40px;background:radial-gradient(circle at 30% 25%,#E9FFFC 0%,#E3F3EA 45%,#F3F5F7 100%);display:grid;place-items:center;overflow:hidden}
.v-site.home .float{width:52%;transform:rotate(-6deg);animation:ccs-float 7s ease-in-out infinite alternate}
.v-site.home .float img{display:block;width:100%;border-radius:16px;box-shadow:0 40px 80px rgba(17,19,24,.22),0 8px 20px rgba(17,19,24,.10);background:#fff}
@keyframes ccs-float{from{transform:rotate(-6deg) translateY(0)}to{transform:rotate(-4deg) translateY(-14px)}}
.v-site.rs-modal img{display:block;width:100%;border-radius:12px;border:1px solid var(--line)}

@media (max-width:1100px){
  .v-site.home .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}
  .v-site.home .two{grid-template-columns:1fr}
  .v-site.home .two .vis{max-width:704px;width:100%;margin:0 auto}
}
@media (max-width:720px){
  .v-site.home .h-top{padding:56px 16px 44px}
  .v-site.home .glow{width:420px;height:180px;top:40px;filter:blur(28px)}
  .v-site.home .h-title{font-size:42px}
  .v-site.home .h-lead{font-size:16px;max-width:300px;margin:14px auto 0;line-height:1.6}
  .v-site.home .h-cta{gap:12px;margin-top:28px}
  .v-site.home .pill{padding:13px 22px;font-size:15px}
  .v-site.home .vdiv{height:22px}
  .v-site.home .h-photo{padding:0 0 64px}
  .v-site.home .ph{height:440px}
  .v-site.home .ph h2{font-size:25px}
  .v-site.home .ph .txt .en{font-size:13px;margin-bottom:14px}
  .v-site .sec-t h2{font-size:28px}.v-site .sec-t p{font-size:15px}
  .v-site.home .h-msig,.v-site.home .h-code{padding-bottom:64px}
  .v-site.home .cards{gap:32px;margin-top:28px}
  .v-site.home .mcard .ttl{font-size:24px;margin-top:14px}.v-site.home .mcard p{font-size:15px}
  .v-site.home .two .tx h2{font-size:28px}.v-site.home .two .tx p{font-size:17px;margin:16px 0 24px}
  .v-site.home .two .vis{border-radius:28px}
}
@media (max-width:560px){
  .v-site.home .cards{grid-template-columns:1fr}
  .v-site.home .mcard .im{aspect-ratio:16/12;border-radius:28px}
}

/* =========================================================
   케미코드란
   ========================================================= */
.v-site .dims{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.v-site .dim{position:relative;display:flex;flex-direction:column;gap:6px;padding:28px 26px 30px;border-radius:24px;background:var(--bg2);transition:transform .2s,box-shadow .2s}
.v-site .dim:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.v-site .dim .lt{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-family:var(--f-title);font-size:24px;color:#fff;margin-bottom:10px}
.v-site .dim.M .lt{background:var(--M)}.v-site .dim.S .lt{background:var(--S)}.v-site .dim.I .lt{background:var(--I)}.v-site .dim.G .lt{background:var(--G)}
.v-site .dim .en{font-size:14px;color:var(--sub)}
.v-site .dim h3{font-size:22px}
.v-site .dim p{color:var(--sub);font-size:15px;line-height:1.55}
.v-site .feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.v-site .feature.flip .vis{order:2}
.v-site .feature .ftx h2{font-size:38px;line-height:1.3}
.v-site .feature .ftx>p{margin-top:18px;font-size:17px;color:var(--ink2);line-height:1.75}
.v-site .feature .vis{border-radius:32px;overflow:hidden;aspect-ratio:5/4}
.v-site .feature .vis.photo img{width:100%;height:100%;object-fit:cover}
.v-site .feature .vis.soft{background:linear-gradient(140deg,#E9FFFC,#E3F3EA 55%,#F5F6F8);display:flex;align-items:center;justify-content:center;padding:36px}
.v-site .list{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-direction:column;gap:10px}
.v-site .list li{position:relative;padding-left:22px;color:var(--ink2);font-size:16px}
.v-site .list li::before{content:"";position:absolute;left:4px;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--green)}
.v-site .split{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}
.v-site .split>div{background:#fff;border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:4px;box-shadow:inset 0 0 0 1px var(--line)}
.v-site .split b{font-size:17px;color:var(--green)}
.v-site .split span{font-size:14px;color:var(--sub)}
.v-site .pair{max-width:380px}
.v-site .pair .pp{display:flex;align-items:center;gap:18px;margin:14px 0}
.v-site .pair .cc{padding:20px 26px;font-size:28px}
.v-site .pair .x{font-size:28px;color:var(--sub)}
.v-site .pair b.t{display:block;font-size:20px;margin-bottom:6px}
.v-site .pair p{color:var(--sub);font-size:15px}
/* 네트워크 그림 */
.v-site .netbox{background:radial-gradient(circle at 50% 50%,#173B30 0%,#0F1F1A 70%);display:grid;place-items:center}
.v-site .net{width:92%;height:auto}
.v-site .net .ln{stroke:rgba(155,255,249,.45);stroke-width:1.2;stroke-dasharray:4 7;animation:ccs-flow 2.6s linear infinite;animation-delay:var(--d)}
.v-site .net .rim{stroke:rgba(255,255,255,.12);stroke-width:1}
.v-site .net .ax{stroke:rgba(255,255,255,.10);stroke-width:1;stroke-dasharray:2 6}
.v-site .net .dt{fill:#9BFFF9;animation:ccs-blink 3s ease-in-out infinite;animation-delay:var(--d)}
.v-site .net .core{fill:rgba(26,115,83,.9);stroke:#9BFFF9;stroke-width:1.5}
.v-site .net .core-t{fill:#fff;font-family:var(--f-title);font-size:24px}
.v-site .net .hub circle{fill:#fff}
.v-site .net .hub .halo{fill:none;stroke-width:2;opacity:.6;transform-box:fill-box;transform-origin:center;animation:ccs-halo 2.8s ease-out infinite}
.v-site .net .hub text{font-family:var(--f-title);font-size:24px}
.v-site .net .hub.M .halo{stroke:var(--M)}.v-site .net .hub.M text{fill:var(--M)}
.v-site .net .hub.S .halo{stroke:var(--S);animation-delay:.7s}.v-site .net .hub.S text{fill:var(--S)}
.v-site .net .hub.I .halo{stroke:var(--I);animation-delay:1.4s}.v-site .net .hub.I text{fill:var(--I)}
.v-site .net .hub.G .halo{stroke:var(--G);animation-delay:2.1s}.v-site .net .hub.G text{fill:var(--G)}
@keyframes ccs-flow{to{stroke-dashoffset:-22}}
@keyframes ccs-blink{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes ccs-halo{0%{transform:scale(.8);opacity:.7}100%{transform:scale(1.5);opacity:0}}
@media (max-width:1000px){.v-site .dims{grid-template-columns:repeat(2,minmax(0,1fr))}.v-site .feature{grid-template-columns:1fr;gap:32px}.v-site .feature.flip .vis{order:0}}
@media (max-width:720px){.v-site .dims{gap:12px}.v-site .dim{padding:20px 18px}.v-site .dim h3{font-size:18px}.v-site .dim p{font-size:14px}.v-site .feature .ftx h2{font-size:28px}.v-site .feature .ftx>p{font-size:16px}.v-site .feature .vis{border-radius:24px}.v-site .pair .cc{padding:16px 20px;font-size:24px}}
@media (max-width:420px){.v-site .split{grid-template-columns:1fr}}

/* =========================================================
   16가지 유형
   ========================================================= */
.v-site .types-wrap{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:40px;align-items:start}
.v-site .focus-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.v-site .fchip{border:0;cursor:pointer;border-radius:999px;padding:8px 14px;font-size:13px;background:var(--bg2);color:var(--ink2);font-family:var(--f-body)}
.v-site .fchip:hover{background:var(--bg3)}
.v-site .fchip.on{background:var(--ink);color:#fff}
.v-site .fchip.M.on{background:var(--M)}.v-site .fchip.S.on{background:var(--S)}.v-site .fchip.I.on{background:var(--I)}.v-site .fchip.G.on{background:var(--G)}
.v-site .matrix{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.v-site .matrix .cell{position:relative;border:0;cursor:pointer;aspect-ratio:1/1;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:var(--f-body);transition:transform .15s,box-shadow .15s,opacity .2s,filter .2s}
.v-site .matrix .cell .cd{font-family:var(--f-title);font-size:24px;letter-spacing:.02em}
.v-site .matrix .cell .rk{font-size:12px;opacity:.75}
.v-site .matrix .cell:hover{transform:translateY(-2px)}
.v-site .matrix .cell.on{box-shadow:0 0 0 3px currentColor,0 12px 28px rgba(17,19,24,.12)}
.v-site .matrix.has-focus .cell:not(.hit){opacity:.32;filter:grayscale(.6)}
.v-site .matrix.has-focus .cell.hit{box-shadow:0 0 0 2px currentColor}
.v-site .matrix.has-focus .cell.hit.on{box-shadow:0 0 0 3px currentColor,0 12px 28px rgba(17,19,24,.12)}
.v-site .legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;font-size:13px;color:var(--sub)}
.v-site .legend span{display:inline-flex;align-items:center;gap:6px}
.v-site .legend i{width:14px;height:14px;border-radius:4px;display:inline-block}
.v-site .detail{background:#fff;border-radius:28px;padding:32px;box-shadow:var(--shadow),inset 0 0 0 1px var(--line);position:sticky;top:104px;scroll-margin-top:130px}
.v-site .td-head{display:flex;gap:20px;align-items:center}
.v-site .td-head .cc.big{min-width:104px;height:104px;font-size:30px;border-radius:24px}
.v-site .td-head h2{margin-top:10px;font-size:30px}
.v-site .td-head h2 small{display:block;margin-top:6px;font-family:var(--f-body);font-size:15px;color:var(--sub);line-height:1.5}
.v-site .td-body{margin-top:24px;display:flex;flex-direction:column;gap:20px}
.v-site .script{font-size:16px;line-height:1.8;color:var(--ink2);background:var(--bg2);border-radius:18px;padding:20px 22px;white-space:normal}
.v-site .ls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.v-site .ls .li{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line)}
.v-site .ls .lt{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-family:var(--f-title);font-size:18px;flex:none;background:var(--bg3);color:#A0A6B1}
.v-site .ls .li b{display:block;font-weight:400;font-size:14px}
.v-site .ls .li span{font-size:12px;color:var(--sub)}
.v-site .ls .li.off{opacity:.65}
.v-site .ls .li.off b{color:var(--sub)}
.v-site .ls .li.M .lt{background:var(--M);color:#fff}.v-site .ls .li.S .lt{background:var(--S);color:#fff}.v-site .ls .li.I .lt{background:var(--I);color:#fff}.v-site .ls .li.G .lt{background:var(--G);color:#fff}
.v-site .td-act{margin-top:24px}
@media (max-width:1000px){.v-site .types-wrap{grid-template-columns:1fr}.v-site .detail{position:static}}
@media (max-width:720px){
  .v-site .matrix{gap:8px}.v-site .matrix .cell{border-radius:14px}.v-site .matrix .cell .cd{font-size:17px}.v-site .matrix .cell .rk{font-size:11px}
  .v-site .detail{padding:22px 18px;border-radius:22px}
  .v-site .td-head{gap:14px}.v-site .td-head .cc.big{min-width:76px;height:76px;font-size:22px;border-radius:18px}.v-site .td-head h2{font-size:22px}
  .v-site .ls{grid-template-columns:1fr}
  .v-site .td-act .btn{flex:1}
}

/* =========================================================
   조직 궁합
   ========================================================= */
.v-site .pick{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:24px;align-items:center}
.v-site .pick .who{background:var(--bg2);border-radius:28px;padding:28px}
.v-site .pick .who h3{font-size:22px;margin:4px 0 18px}
.v-site .pick .xx{font-family:var(--f-title);font-size:40px;color:var(--sub)}
.v-site .codes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.v-site .codes .ch{border:0;cursor:pointer;border-radius:12px;padding:12px 4px;font-family:var(--f-title);font-size:16px;letter-spacing:.02em;transition:transform .12s,box-shadow .12s,opacity .12s;opacity:.8}
.v-site .codes .ch:hover{opacity:1;transform:translateY(-1px)}
.v-site .codes .ch.on{opacity:1;box-shadow:0 0 0 2.5px currentColor;background:#fff}
.v-site .verdict{margin-top:28px;background:#fff;border-radius:28px;padding:32px;box-shadow:var(--shadow),inset 0 0 0 1px var(--line)}
.v-site .vd-top{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:center}
.v-site .ring{width:150px;height:150px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}
.v-site .ring .t{font-size:24px;line-height:1.1}
.v-site .ring i{font-style:normal;font-size:16px;opacity:.6}
.v-site .ring.good{background:radial-gradient(circle,#fff 52%,transparent 53%),conic-gradient(var(--green),var(--mint),var(--green));color:var(--green)}
.v-site .ring.mid{background:radial-gradient(circle,#fff 52%,transparent 53%),conic-gradient(#2E86AB,#BFE3F0,#2E86AB);color:#22628A}
.v-site .ring.hard{background:radial-gradient(circle,#fff 52%,transparent 53%),conic-gradient(#D9A21B,#FBE7B5,#D9A21B);color:#8A6410}
.v-site .vd-top h3{font-size:26px;margin:10px 0 10px}
.v-site .vd-top p{color:var(--ink2);font-size:16px;line-height:1.75}
.v-site .vd-grid{margin-top:28px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.v-site .vd-grid>div{background:var(--bg2);border-radius:18px;padding:16px}
.v-site .vd-grid b{font-weight:400;font-size:13px;color:var(--sub)}
.v-site .lrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.v-site .lchip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 12px 5px 6px;background:#fff;font-family:var(--f-title);font-size:14px;box-shadow:inset 0 0 0 1px var(--line)}
.v-site .lchip em{font-style:normal;font-family:var(--f-body);font-size:12px;color:var(--sub)}
.v-site .lchip::before{content:"";width:10px;height:10px;border-radius:50%;margin-left:4px}
.v-site .lchip.M::before{background:var(--M)}.v-site .lchip.S::before{background:var(--S)}.v-site .lchip.I::before{background:var(--I)}.v-site .lchip.G::before{background:var(--G)}
.v-site .mnote{margin-top:20px}
@media (max-width:1000px){.v-site .pick{grid-template-columns:1fr}.v-site .pick .xx{text-align:center;line-height:1}.v-site .vd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){
  .v-site .pick .who{padding:20px 16px;border-radius:22px}.v-site .pick .who h3{font-size:18px;margin-bottom:14px}
  .v-site .codes{gap:6px}.v-site .codes .ch{font-size:14px;padding:10px 2px}
  .v-site .verdict{padding:22px 18px;border-radius:22px}
  .v-site .vd-top{grid-template-columns:1fr;justify-items:center;text-align:center;gap:16px}
  .v-site .ring{width:120px;height:120px}.v-site .ring .t{font-size:20px}
  .v-site .vd-top h3{font-size:21px}.v-site .vd-top p{font-size:15px;text-align:left}
  .v-site .vd-grid{grid-template-columns:1fr}
}

/* =========================================================
   검사 신청
   ========================================================= */
.v-site .apply{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:32px;align-items:start}
.v-site .ap-form{box-shadow:var(--shadow),inset 0 0 0 1px var(--line)}
.v-site .agree{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.v-site .agree .req{color:var(--F)}
.v-site .agree .help a{text-decoration:underline;text-underline-offset:2px}
.v-site .err:empty{display:none}
.v-site .ap-side{background:var(--bg2);border-radius:24px;padding:28px}
.v-site .ap-side h3{font-size:20px;margin-bottom:18px}
.v-site .steps{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column;gap:16px}
.v-site .steps li{display:flex;gap:14px;align-items:flex-start}
.v-site .steps .n{flex:none;width:30px;height:30px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-family:var(--f-title);font-size:14px}
.v-site .steps b{font-weight:400;font-family:var(--f-title);font-size:16px}
.v-site .steps p{font-size:14px;color:var(--sub);margin-top:2px}
.v-site .done{text-align:center;padding:40px 8px}
.v-site .done .ok{width:72px;height:72px;border-radius:50%;background:var(--green);display:grid;place-items:center;margin:0 auto 22px;box-shadow:0 0 0 10px var(--green-l)}
.v-site .done h2{font-size:28px}
.v-site .done p{margin-top:10px;font-size:17px;color:var(--ink2)}
@media (max-width:1000px){.v-site .apply{grid-template-columns:1fr}}
@media (max-width:720px){.v-site .ap-side{padding:22px 18px}.v-site .form-actions .btn{width:100%}.v-site .done .btns .btn{flex:1}}

/* ---------- 움직임 줄이기 ---------- */
@media (prefers-reduced-motion: reduce){
  .v-site *,.v-site *::before,.v-site *::after{animation:none!important;transition:none!important}
  .v-site.home .ph .w,.v-site.home .ph .txt .en{opacity:1!important;transform:none!important;filter:none!important}
}

/* =========================================================
   30 member — 로그인 · 초대 가입 · 검사 정보 · 72문항 · 내 정보 · 결과(웹) · 매칭(웹)
   모든 선택자는 .v-member 아래 (시안 01·02·04·05·06·21·25 + assets/result.css 를 옮김)
   ========================================================= */
.v-member [hidden]{display:none!important}
.v-member{word-break:keep-all}

/* ---------- 01·02 로그인 / 초대 가입 ---------- */
.v-member.auth{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--bg2)}
.v-member .auth-art{position:relative;margin:16px 0 16px 16px;border-radius:28px;overflow:hidden;background-position:center;background-size:cover;background-color:var(--green-d)}
.v-member .auth-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,92,66,.05) 30%,rgba(20,92,66,.88))}
.v-member .auth-art .cap{position:absolute;left:40px;right:40px;bottom:40px;z-index:1;color:#fff;display:flex;flex-direction:column;gap:10px}
.v-member .auth-art .cap .en{color:var(--mint);font-size:14px}
.v-member .auth-art .cap .t{font-size:28px;line-height:1.35}
.v-member .auth-side{display:flex;align-items:center;justify-content:center;padding:48px 24px}
.v-member .auth-box{width:100%;max-width:420px;display:flex;flex-direction:column;gap:20px}
.v-member .auth-box.wide{max-width:460px}
.v-member .brand{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.v-member .brand img{height:44px;width:auto}
.v-member .brand .wm{font-size:28px}.v-member .brand .wm b{color:var(--green);font-weight:400}
.v-member .brand-sub{text-align:center;margin-top:-12px}
.v-member .alert.ok{background:var(--safe-bg);color:var(--green-d)}
.v-member .demo-acc{border:1px dashed var(--line2);border-radius:var(--r-box);padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.v-member .demo-acc .accs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.v-member .demo-acc button{border:0;background:#fff;box-shadow:inset 0 0 0 1px var(--line);border-radius:12px;padding:9px 8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:13px;color:var(--ink2);transition:background .15s,box-shadow .15s}
.v-member .demo-acc button:hover{background:var(--green-l);box-shadow:inset 0 0 0 1px var(--green);color:var(--green-d)}
.v-member .demo-acc button span{font-size:11px;color:var(--sub)}
.v-member .inviter{display:flex;align-items:center;gap:10px;background:var(--green-l);color:var(--green-d);border-radius:var(--r-box);padding:12px 16px;font-size:14px}
.v-member .inviter .av{flex:none;width:32px;height:32px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-family:var(--f-title);font-size:14px}
.v-member.auth .grid-2{gap:16px}
.v-member .link-u{color:var(--green);text-decoration:underline}
@media (max-width:900px){.v-member.auth{grid-template-columns:1fr}.v-member .auth-art{display:none}.v-member .auth-side{padding:40px 16px}}
@media (max-width:480px){.v-member.auth .grid-2{grid-template-columns:1fr}.v-member .demo-acc .accs{grid-template-columns:1fr}.v-member .demo-acc button{flex-direction:row;justify-content:space-between;padding:10px 14px}}

/* ---------- 04 검사 정보 ---------- */
.v-member .resume{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;background:#fff;border:1.5px solid var(--green);border-radius:var(--r-box);padding:18px 22px;margin-bottom:20px}
.v-member .resume .t{font-size:18px}
.v-member .resume .bar{width:220px;height:8px;margin-top:8px}
@media (max-width:720px){.v-member .resume .bar{width:100%}.v-member .resume .btn{width:100%}}

/* ---------- 05 검사 문항 ---------- */
.v-member .ex-top{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
.v-member .part{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--ink2);background:#fff;border:1px solid var(--line);border-radius:var(--pill);padding:6px 14px}
.v-member .part .en{color:var(--green);font-size:13px}
.v-member .prog{font-size:22px}.v-member .prog b{font-weight:400;color:var(--green)}.v-member .prog .muted{font-size:16px}
.v-member .ex-top .bar{height:8px}
.v-member .ex-top .bar>i{transition:width .2s}
.v-member .qcard{min-height:420px;display:flex;flex-direction:column;padding:44px 40px 36px}
.v-member .qtext{font-size:28px;line-height:1.45;display:flex;gap:14px;align-items:flex-start}
.v-member .qtext .qno{color:var(--green);flex:none}
.v-member .answers{margin-top:auto;padding-top:36px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.v-member .ans{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:120px;padding:14px 6px;border-radius:18px;border:2px solid var(--line2);background:#fff;cursor:pointer;font-family:var(--f-body);font-size:15px;color:var(--ink2);transition:border-color .15s,background .15s,transform .05s}
.v-member .ans:hover{border-color:var(--green);background:#F6FBF8}
.v-member .ans:active{transform:translateY(1px)}
.v-member .ans .n{width:40px;height:40px;border-radius:50%;background:var(--bg2);display:grid;place-items:center;font-family:var(--f-title);font-size:18px;color:var(--ink2)}
.v-member .ans .s{display:none}
.v-member .ans.on{border-color:var(--green);background:var(--green-l);color:var(--green-d)}
.v-member .ans.on .n{background:var(--green);color:#fff}
.v-member .ex-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px}
.v-member .ex-nav .cnt{font-size:14px;color:var(--sub)}.v-member .ex-nav .cnt b{font-weight:400;color:var(--ink)}
.v-member .save-note{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:16px;font-size:13px;color:var(--sub);text-align:center}
.v-member .save-note::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--safe)}
.v-member .submit-wrap{margin-top:24px;display:flex;flex-direction:column;align-items:center;gap:8px}
.v-member .done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:40px}
.v-member .done .ok{width:64px;height:64px;border-radius:50%;background:var(--green-l);display:grid;place-items:center;margin-bottom:4px}
.v-member .done .bar{width:100%;max-width:420px;height:8px;margin:6px 0 10px}
.v-member details.jump{margin-top:24px}
.v-member .jgrid-h{font-size:13px;color:var(--sub);margin:4px 0 8px}
.v-member .jgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;margin-bottom:14px}
.v-member .jgrid button{height:34px;border-radius:9px;border:1px solid var(--line2);background:#fff;color:var(--sub);font-size:13px;cursor:pointer;font-variant-numeric:tabular-nums;padding:0}
.v-member .jgrid button.on{background:var(--green-l);border-color:transparent;color:var(--green-d)}
.v-member .jgrid button.cur{box-shadow:0 0 0 2px var(--green);border-color:transparent;color:var(--ink)}
.v-member .jgrid button:hover{border-color:var(--green)}
.v-member .jlegend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--sub);align-items:center}
.v-member .jlegend i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:5px;vertical-align:-1px;border:1px solid var(--line2)}
.v-member .jlegend i.on{background:var(--green-l);border-color:transparent}
@media (max-width:720px){
  .v-member.exam-main{padding-bottom:128px}
  .v-member .prog{font-size:19px}
  .v-member .qcard{min-height:0;padding:28px 20px}
  .v-member .qtext{font-size:21px;gap:10px}
  .v-member .answers{position:fixed;left:0;right:0;bottom:0;z-index:60;margin:0;padding:22px 12px calc(12px + env(safe-area-inset-bottom));gap:6px;background:linear-gradient(rgba(255,255,255,0),#fff 20px)}
  .v-member .ans{min-height:66px;gap:4px;padding:8px 2px;border-radius:14px;font-size:13px;box-shadow:0 4px 14px rgba(17,19,24,.06)}
  .v-member .ans .n{width:28px;height:28px;font-size:14px}
  .v-member .ans .l{display:none}.v-member .ans .s{display:block}
  .v-member .ex-nav .btn{padding:10px 14px;font-size:14px}
  .v-member .done{padding:32px 20px}
  .v-member .done .btn.lg{width:100%}
  .v-member .jgrid{grid-template-columns:repeat(8,minmax(0,1fr))}
  .v-member .save-note .hide-m{display:none}
}

/* ---------- 06 내 정보 ---------- */
.v-member .empty-box{border:1.5px dashed var(--line2);border-radius:var(--r-box);padding:40px 16px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.v-member .empty-box .t{font-size:18px;color:var(--ink2)}
.v-member .empty-box .btn{margin-top:10px}

/* ---------- 21 결과 · 25 매칭 (assets/result.css 를 .v-member 아래로) ---------- */
.v-member .wealth-note{font-size:12px;color:var(--warn);line-height:1.4}
.v-member .rs-stat .v b.dash{color:var(--sub)}
.v-member{--plus:#1A7353;          
  --minus:#D9734E;         
  --base:#3A3F4B;          
  --off:#B8BFCA;           
  --pa:#1A7353;            
  --pb:#3A6FC4;            
  --t1:#E3F3EA;--t1f:#2F7D52; --t2:#E4F1F6;--t2f:#2E6F8E; --t3:#FDF0DC;--t3f:#8F6406; --t4:#FBEAE6;--t4f:#B8431F;}
.v-member .rs{display:flex;flex-direction:column;gap:24px}
.v-member .rs-sec{display:flex;flex-direction:column;gap:20px}
.v-member .rs-head{display:flex;flex-direction:column;gap:6px;max-width:760px}
.v-member .rs-head .en{color:var(--green);font-size:14px}
.v-member .rs-head h2{font-size:26px}
.v-member .rs-head p{color:var(--sub)}
.v-member .rs-sub{font-family:var(--f-title);font-size:17px;margin-bottom:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.v-member .rs-note{font-size:13px;color:var(--sub);line-height:1.6}
.v-member .rs-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.v-member .rs-split.w55{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
@media (max-width:900px){.v-member .rs-split,.v-member .rs-split.w55{grid-template-columns:1fr}
}
.v-member .rs-staff{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 12px 10px 16px;border:1.5px dashed var(--line2);border-radius:var(--r-box);background:#fff}
.v-member .rs-staff .tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--sub)}
.v-member .rs-staff .tag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--info)}
.v-member .rs-hero{position:relative;overflow:hidden;border-radius:28px;padding:44px 48px;color:#fff;
  background:radial-gradient(120% 140% at 100% 0%,rgba(155,255,249,.28) 0%,rgba(155,255,249,0) 46%),linear-gradient(135deg,#1A7353 0%,#145C42 100%)}
.v-member .rs-hero::after{content:"";position:absolute;right:-60px;bottom:-90px;width:320px;height:320px;border-radius:50%;border:44px solid rgba(155,255,249,.10)}
.v-member .rs-hero .en{color:var(--mint);font-size:14px}
.v-member .rs-hero h1{font-size:30px;margin-top:8px}
.v-member .rs-hero .meta{color:rgba(255,255,255,.72);font-size:14px;margin-top:6px}
.v-member .rs-hero .type{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-top:28px;position:relative;z-index:1}
.v-member .rs-hero .type b{font-family:var(--f-title);font-weight:400;font-size:84px;line-height:.9;color:var(--mint);letter-spacing:.01em}
.v-member .rs-hero .type b small{font-size:34px;color:#fff;margin-left:6px}
.v-member .rs-hero .type p{font-size:19px;line-height:1.45;max-width:520px;padding-bottom:6px}
@media (max-width:720px){.v-member .rs-hero{padding:28px 22px;border-radius:22px}
.v-member .rs-hero h1{font-size:22px}
.v-member .rs-hero .type{margin-top:20px}
.v-member .rs-hero .type b{font-size:60px}
.v-member .rs-hero .type b small{font-size:26px}
.v-member .rs-hero .type p{font-size:16px}
.v-member .rs-hero::after{width:200px;height:200px;border-width:28px}
}
.v-member .rs-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.v-member .rs-stat{background:#fff;border-radius:var(--r-card);box-shadow:var(--shadow);padding:24px 26px;display:flex;flex-direction:column;gap:6px}
.v-member .rs-stat .k{font-size:14px;color:var(--ink2)}
.v-member .rs-stat .v{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.v-member .rs-stat .v b{font-family:var(--f-title);font-weight:400;font-size:36px;line-height:1.1}
.v-member .rs-stat .v b small{font-size:18px;margin-left:2px}
.v-member .rs-stat .d{font-size:13px;color:var(--sub)}
.v-member .rank-dots{display:grid;grid-template-columns:repeat(16,1fr);gap:3px;margin-top:4px;max-width:240px}
.v-member .rank-dots i{height:6px;border-radius:3px;background:var(--bg3)}
.v-member .rank-dots i.on{background:var(--green)}
@media (max-width:720px){.v-member .rs-stats{gap:8px}
.v-member .rs-stat{padding:16px 12px;border-radius:18px}
.v-member .rs-stat .v b{font-size:24px}
.v-member .rs-stat .v b small{font-size:14px}
.v-member .rs-stat .k{font-size:12px}
.v-member .rs-stat .d{font-size:11px}
.v-member .rs-stat .badge{font-size:11px;padding:2px 8px}
}
.v-member .mind{background:var(--green-l);border-radius:var(--r-box);padding:22px 24px;display:flex;flex-direction:column;gap:6px}
.v-member .mind .k{font-size:13px;color:var(--green)}
.v-member .mind .t{font-size:28px;color:var(--green-d)}
.v-member .mind .s{font-size:14px;color:var(--ink2)}
.v-member .mind .s b{font-weight:400;font-family:var(--f-title);color:var(--green-d)}
.v-member .mind p{font-size:15px;color:var(--ink2)}
.v-member .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--ink2);align-items:center}
.v-member .legend span{display:inline-flex;align-items:center;gap:6px}
.v-member .legend .sw{width:14px;height:10px;border-radius:3px;display:inline-block}
.v-member .legend .ln{width:18px;height:0;border-top:2px dashed var(--base);display:inline-block}
.v-member .radar{width:100%;height:auto;display:block;max-width:560px;margin:0 auto}
.v-member .radar text{font-family:var(--f-body);font-size:14px;fill:var(--ink2)}
.v-member .radar text .v{fill:var(--sub);font-size:12px}
.v-member .radar .pt{cursor:default}
.v-member .hbars{display:flex;flex-direction:column;gap:4px}
.v-member .hbars .grp{font-size:13px;color:var(--sub);margin:12px 0 4px;display:flex;align-items:center;gap:8px}
.v-member .hbars .grp:first-child{margin-top:0}
.v-member .hbars .grp i{width:8px;height:8px;border-radius:50%}
.v-member .hb{display:grid;grid-template-columns:84px minmax(0,1fr) 46px 48px;gap:12px;align-items:center;padding:6px 0}
.v-member .hb .n{font-size:14px}
.v-member .hb .tr{position:relative;height:12px;border-radius:999px;background:var(--bg3)}
.v-member .hb .tr>i{position:absolute;left:0;top:0;bottom:0;border-radius:999px}
.v-member .hb .tr>u{position:absolute;top:-5px;bottom:-5px;width:0;border-left:2px dashed var(--base);opacity:.55}
.v-member .hb .p{font-family:var(--f-title);font-size:15px;text-align:right}
.v-member .hb .m{display:flex;justify-content:flex-start}
.v-member .hb.dim .n,.v-member .hb.dim .p{color:var(--sub)}
.v-member .axis-note{display:flex;justify-content:space-between;font-size:12px;color:var(--sub);margin:6px 0 0 96px;padding-right:106px}
.v-member .delta{font-variant-numeric:tabular-nums}
.v-member .delta.up{color:var(--low)}
.v-member .delta.dn{color:var(--ink2)}
.v-member .delta.zero{color:var(--sub)}
.v-member .badge.st-safe{background:var(--safe-bg);color:var(--safe)}
.v-member .badge.st-low{background:var(--low-bg);color:var(--low)}
.v-member .badge.st-warn{background:var(--warn-bg);color:var(--warn)}
.v-member .side{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink2)}
.v-member .side i{width:8px;height:8px;border-radius:50%}
.v-member .sum-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--bg2);border-radius:12px;padding:10px 14px;font-size:14px;margin-top:12px}
.v-member details.fold{border:1px solid var(--line);border-radius:var(--r-box);background:#fff}
.v-member details.fold>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 22px;font-family:var(--f-title);font-size:17px}
.v-member details.fold>summary::-webkit-details-marker{display:none}
.v-member details.fold>summary::after{content:"";width:10px;height:10px;border-right:2px solid var(--sub);border-bottom:2px solid var(--sub);transform:rotate(45deg);margin:-4px 4px 0 0;transition:transform .2s;flex:none}
.v-member details.fold[open]>summary::after{transform:rotate(-135deg);margin-top:4px}
.v-member details.fold>summary small{font-family:var(--f-body);font-size:13px;color:var(--sub)}
.v-member details.fold .fold-in{padding:0 22px 22px}
.v-member .tbl tr.on td:first-child{box-shadow:inset 3px 0 0 var(--green)}
.v-member .tbl td.ty{font-family:var(--f-title)}
@media (max-width:720px){.v-member details.fold>summary{padding:16px}
.v-member details.fold .fold-in{padding:0 12px 14px}
.v-member .stack-m .tbl td.wrap{min-width:0}
.v-member .stack-m .tbl tr.on{border-color:var(--green);background:#F1FAF5}
.v-member .stack-m .tbl tr.on td{background:none;box-shadow:none}
}
.v-member .brain{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;justify-items:center}
.v-member .brain svg{width:100%;max-width:360px;height:auto;display:block}
.v-member .brain .sym{font-family:var(--f-title);fill:#fff}
.v-member .brain-legend{width:100%;display:flex;flex-direction:column;gap:2px}
.v-member .bl{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 4px;border-bottom:1px solid var(--line)}
.v-member .bl:last-child{border-bottom:0}
.v-member .bl .c{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:#fff;font-family:var(--f-title);font-size:16px;line-height:1}
.v-member .bl .n{font-size:14px}
.v-member .bl .n b{font-family:var(--f-title);font-weight:400;margin-right:6px}
.v-member .bl .r{display:flex;gap:6px;align-items:center;font-size:14px}
.v-member .bl .r .num{font-family:var(--f-title);min-width:40px;text-align:right}
.v-member .script{font-size:16px;line-height:1.75;color:var(--ink2);background:var(--bg2);border-radius:var(--r-box);padding:20px 22px}
.v-member .script b{font-family:var(--f-title);font-weight:400;color:var(--green-d)}
.v-member .mbars{display:flex;flex-direction:column;gap:14px}
.v-member .mb{display:grid;grid-template-columns:150px minmax(0,1fr) 60px 56px;gap:12px;align-items:center}
.v-member .mb .n{display:flex;align-items:center;gap:8px;font-size:14px;white-space:nowrap}
.v-member .mb .n .code{min-width:32px;padding:2px 8px;font-size:13px}
.v-member .mb .tr{position:relative;height:14px;border-radius:999px;background:var(--bg3)}
.v-member .mb .tr>i{position:absolute;left:0;top:0;bottom:0;border-radius:999px}
.v-member .mb .tr>u{position:absolute;top:-6px;bottom:-6px;width:0;border-left:2px dashed var(--base);opacity:.6}
.v-member .mb .p{font-family:var(--f-title);font-size:15px;text-align:right}
.v-member .mbars .scale{display:grid;grid-template-columns:150px minmax(0,1fr) 60px 56px;gap:12px;font-size:12px;color:var(--sub)}
.v-member .mbars .scale span{position:relative;height:16px}
.v-member .mbars .scale em{position:absolute;transform:translateX(-50%);font-style:normal;white-space:nowrap}
@media (max-width:720px){.v-member .mb,.v-member .mbars .scale{grid-template-columns:minmax(0,1fr) 52px 52px;row-gap:6px}
.v-member .mb .n{grid-column:1/-1}
.v-member .mbars .scale>span:first-child{display:none}
.v-member .hb{grid-template-columns:70px minmax(0,1fr) 40px 40px;gap:8px}
.v-member .axis-note{margin-left:78px;padding-right:88px}
}
.v-member .tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.v-member .tile{position:relative;border-radius:16px;aspect-ratio:1.35/1;display:grid;place-items:center;font-family:var(--f-title);font-size:24px;letter-spacing:.02em}
.v-member .tile .no{position:absolute;left:12px;top:9px;font-size:13px;opacity:.8}
.v-member .tile.t1{background:var(--t1);color:var(--t1f)}
.v-member .tile.t2{background:var(--t2);color:var(--t2f)}
.v-member .tile.t3{background:var(--t3);color:var(--t3f)}
.v-member .tile.t4{background:var(--t4);color:var(--t4f)}
.v-member .tile.none{font-size:17px}
.v-member .tile.you{background:var(--green);color:#fff;box-shadow:0 10px 24px rgba(26,115,83,.32);transform:scale(1.04);z-index:1}
.v-member .tile .you-tag{position:absolute;right:10px;top:9px;background:var(--mint);color:var(--green-d);font-family:var(--f-en);font-size:11px;letter-spacing:.08em;border-radius:999px;padding:1px 8px}
.v-member .tier-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--sub);margin-top:12px}
.v-member .tier-legend span{display:inline-flex;align-items:center;gap:6px}
.v-member .tier-legend i{width:12px;height:12px;border-radius:4px}
.v-member .bul{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;list-style:none}
.v-member .bul li{display:flex;gap:10px;font-size:15px;color:var(--ink2)}
.v-member .bul li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--green);margin-top:9px}
.v-member .letters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.v-member .letters div{display:flex;align-items:center;gap:10px;background:var(--bg2);border-radius:12px;padding:10px 12px;font-size:14px}
.v-member .letters .code{min-width:34px}
.v-member .letters .op{margin-left:auto;color:var(--sub);font-family:var(--f-title)}
.v-member .you-card{display:flex;align-items:center;gap:14px;background:var(--green-l);border-radius:var(--r-box);padding:18px 20px}
.v-member .you-card .code{background:var(--green);color:#fff;font-size:18px;padding:6px 14px}
.v-member .you-card p{font-size:16px;color:var(--green-d)}
@media (max-width:720px){.v-member .tiles{gap:6px}
.v-member .tile{font-size:16px;border-radius:12px;aspect-ratio:1/1}
.v-member .tile.none{font-size:12px}
.v-member .tile .no{left:7px;top:5px;font-size:11px}
.v-member .tile .you-tag{right:50%;transform:translateX(50%);top:auto;bottom:5px;font-size:9px;padding:0 6px}
.v-member .letters{grid-template-columns:1fr}
}
.v-member .rs-close{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;background:#fff;border-radius:var(--r-card);box-shadow:var(--shadow);padding:32px 36px;border-left:6px solid var(--mint)}
.v-member .rs-close .t{font-size:20px}
.v-member .rs-close p{color:var(--sub);margin-top:6px;font-size:14px}
@media (max-width:720px){.v-member .rs-close{padding:24px 20px}
.v-member .rs-close .btns{width:100%}
.v-member .rs-close .btn{flex:1}
}
.main.v-member.match{max-width:1032px}
.v-member .who{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;color:#fff;font-family:var(--f-title);font-size:12px;line-height:1;flex:none}
.v-member .who.a{background:var(--pa)}
.v-member .who.b{background:var(--pb)}
.v-member .mc-cover{position:relative;overflow:hidden;border-radius:28px;padding:44px 40px 40px;color:#fff;
  background:radial-gradient(90% 120% at 50% 0%,rgba(155,255,249,.25),rgba(155,255,249,0) 55%),linear-gradient(160deg,#1A7353 0%,#123F31 100%)}
.v-member .mc-cover .top{text-align:center}
.v-member .mc-cover .en{color:var(--mint);font-size:14px}
.v-member .mc-cover h1{font-size:32px;margin-top:8px}
.v-member .mc-cover h1 em{font-style:normal;color:var(--mint)}
.v-member .mc-cover .lead{color:rgba(255,255,255,.75);margin-top:6px;font-size:15px}
.v-member .mc-pair{display:grid;grid-template-columns:minmax(0,1fr) 200px minmax(0,1fr);gap:20px;align-items:center;margin-top:32px}
.v-member .pcard{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:24px;padding:24px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.v-member .pcard .who{width:48px;height:48px;font-size:22px;border:3px solid rgba(255,255,255,.85);margin-bottom:6px}
.v-member .pcard .nm{font-family:var(--f-title);font-size:22px}
.v-member .pcard .ty{font-size:14px;color:rgba(255,255,255,.8)}
.v-member .pcard .ty b{font-weight:400;font-family:var(--f-title);color:#fff}
.v-member .ring{position:relative;width:200px;height:200px;margin:0 auto}
.v-member .ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.v-member .ring .in{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.v-member .ring .in b{font-family:var(--f-title);font-weight:400;font-size:52px;line-height:1}
.v-member .ring .in b small{font-size:22px;margin-left:2px}
.v-member .ring .in span{font-size:15px;margin-top:6px}
.v-member .ring.on-dark .in b{color:var(--mint)}
.v-member .ring.on-dark .in span{color:#fff}
.v-member .ring.on-light .in b{color:var(--green)}
.v-member .ring.on-light .in span{color:var(--ink)}
@media (max-width:720px){.v-member .mc-cover{padding:28px 18px 22px;border-radius:22px}
.v-member .mc-cover h1{font-size:24px}
.v-member .mc-pair{grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.v-member .mc-pair .ring{grid-column:1/-1;grid-row:1;width:160px;height:160px}
.v-member .ring .in b{font-size:40px}
.v-member .pcard{padding:16px 10px;border-radius:18px}
.v-member .pcard .nm{font-size:18px}
.v-member .pcard .who{width:40px;height:40px;font-size:18px}
}
.v-member .duo-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.v-member .duo-tile{background:var(--bg2);border-radius:var(--r-box);padding:18px 18px 16px;display:flex;flex-direction:column;gap:10px}
.v-member .duo-tile .k{font-size:13px;color:var(--sub)}
.v-member .duo-tile .v{display:flex;align-items:center;gap:8px}
.v-member .duo-tile .v b{font-family:var(--f-title);font-weight:400;font-size:22px;line-height:1.1}
.v-member .duo-tile .v small{font-size:13px;color:var(--sub);margin-left:auto}
@media (max-width:900px){.v-member .duo-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){.v-member .duo-tile{padding:14px}
.v-member .duo-tile .v b{font-size:19px}
}
.v-member .dbars{display:flex;flex-direction:column;gap:2px}
.v-member .dbars .grp{font-size:13px;color:var(--sub);margin:14px 0 6px}
.v-member .dbars .grp:first-child{margin-top:0}
.v-member .db{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.v-member .db:last-child{border-bottom:0}
.v-member .db .n{font-size:14px}
.v-member .db .pair{display:flex;flex-direction:column;gap:6px}
.v-member .dl{display:grid;grid-template-columns:22px minmax(0,1fr) 44px;gap:10px;align-items:center}
.v-member .dl .tr{position:relative;height:10px;border-radius:999px;background:var(--bg3)}
.v-member .dl .tr>i{position:absolute;left:0;top:0;bottom:0;border-radius:999px}
.v-member .dl .tr>u{position:absolute;top:-4px;bottom:-4px;width:0;border-left:2px dashed var(--base);opacity:.5}
.v-member .dl .p{font-family:var(--f-title);font-size:14px;text-align:right}
.v-member .dl .who{width:20px;height:20px;font-size:11px}
.v-member .db.hl{background:linear-gradient(90deg,var(--green-l),rgba(227,243,234,0));border-radius:12px;padding-left:10px;margin-left:-10px}
.v-member .pick2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.v-member .pick{border-radius:var(--r-box);padding:18px 20px;display:flex;flex-direction:column;gap:4px}
.v-member .pick .k{font-size:13px}
.v-member .pick .t{font-size:24px}
.v-member .pick .d{font-size:13px;color:var(--ink2)}
.v-member .pick.same{background:var(--green-l)}
.v-member .pick.same .k{color:var(--green)}
.v-member .pick.diff{background:var(--info-bg)}
.v-member .pick.diff .k{color:var(--info)}
@media (max-width:720px){.v-member .db{grid-template-columns:1fr;gap:6px}
.v-member .pick .t{font-size:20px}
}
.v-member .mcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.v-member .mcard{background:var(--bg2);border-radius:var(--r-box);padding:18px;display:flex;flex-direction:column;gap:12px}
.v-member .mcard .h{display:flex;align-items:center;gap:10px}
.v-member .mcard .h .code{min-width:36px;font-size:16px}
.v-member .mcard .h b{font-weight:400;font-size:15px}
.v-member .mcard .dl{grid-template-columns:20px minmax(0,1fr) 40px;gap:8px}
@media (max-width:900px){.v-member .mcards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){.v-member .mcards{grid-template-columns:1fr}
}
.v-member .tg2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.v-member .tg{border-radius:var(--r-card);padding:26px;display:flex;flex-direction:column;gap:12px;border:1px solid var(--line);background:#fff}
.v-member .tg .ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-family:var(--f-title);font-size:22px}
.v-member .tg.good .ic{background:var(--green-l);color:var(--green)}
.v-member .tg.diff .ic{background:var(--info-bg);color:var(--info)}
.v-member .tg .k{font-size:13px;color:var(--sub)}
.v-member .tg h3{font-size:20px}
.v-member .tg ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.v-member .tg li{display:flex;gap:10px;font-size:15px;color:var(--ink2)}
.v-member .tg li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;margin-top:9px;background:currentColor;opacity:.5}
.v-member .tg.good li::before{background:var(--green);opacity:1}
.v-member .tg.diff li::before{background:var(--info);opacity:1}
.v-member .quote{text-align:center;font-family:var(--f-title);font-size:20px;line-height:1.5;padding:8px 0}
.v-member .quote em{font-style:normal;color:var(--green)}
@media (max-width:720px){.v-member .tg2{grid-template-columns:1fr}
.v-member .tg{padding:20px}
.v-member .quote{font-size:17px}
}
.v-member .final{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:center}
.v-member .final .lead{font-size:17px;line-height:1.6;margin-bottom:16px}
.v-member .final .lead b{font-weight:400;font-family:var(--f-title);color:var(--green-d)}
.v-member .msgs{display:flex;flex-direction:column;gap:10px}
.v-member .msg{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;align-items:center;background:var(--bg2);border-radius:14px;padding:14px 16px}
.v-member .msg .k{display:flex;align-items:center;gap:8px;font-family:var(--f-title);font-size:15px}
.v-member .msg .k i{width:10px;height:10px;border-radius:50%}
.v-member .msg p{font-size:15px;color:var(--ink2)}
.v-member .closing{text-align:center;border-top:1px solid var(--line);padding-top:22px;margin-top:6px;font-size:16px;color:var(--ink2)}
.v-member .closing b{display:block;font-weight:400;font-family:var(--f-title);color:var(--green-d);font-size:18px;margin-top:4px}
@media (max-width:720px){.v-member .final{grid-template-columns:1fr;gap:20px}
.v-member .msg{grid-template-columns:1fr;gap:4px}
.v-member .final .lead{font-size:16px;text-align:center}
}
.v-member .radar text .k{fill:var(--ink)}
.v-member .tbl.gap .sd{display:none;width:8px;height:8px;border-radius:50%;margin-right:8px;vertical-align:1px}
@media (max-width:720px){.v-member .radar text{font-size:22px}
.v-member .radar text .v{font-size:19px}
.v-member .tbl.gap{font-size:13px}
.v-member .tbl.gap th,.v-member .tbl.gap td{padding:10px 8px}
.v-member .tbl.gap .hide-sm{display:none}
.v-member .tbl.gap .sd{display:inline-block;margin-right:5px}
.v-member .bl{grid-template-columns:30px minmax(0,1fr);row-gap:4px}
.v-member .bl .r{grid-column:2}
.v-member .bl .r .num{text-align:left;min-width:0;margin-right:4px}
}
@media (max-width:720px){.v-member details.fold>summary small{display:block;margin-top:4px}
}
.v-member .rs h1,.v-member .rs h2,.v-member .rs h3,.v-member .rs p,.v-member .rs li,.v-member .rs .t,.v-member .pcard .ty,.v-member .pick .k,.v-member .rs-stat .d{word-break:keep-all;overflow-wrap:anywhere}
.v-member .legend .who{display:inline-grid}
.v-member .msg{grid-template-columns:140px minmax(0,1fr)}
@media (max-width:720px){.v-member .msg{grid-template-columns:1fr}
}


/* ===== 72문항 (피그마 '문항화면') ===== */
body.L-exam2{background:#fff}
.v-exam2{--g:#1A7353;--gr:#787878;--fd:#B8BDC3;--ln:#D9DEE2;min-height:100vh;display:flex;flex-direction:column;background:#fff;color:#111}
.v-exam2 .ex2-hd{position:relative;height:150px;max-width:1440px;width:100%;margin:0 auto}
.v-exam2 .ex2-hd .lg img{position:absolute;left:26px;top:21px;width:192px}
.v-exam2 .ex2-hd .out{position:absolute;right:83px;top:70px;font-family:'CC Title',sans-serif;font-size:18px;color:var(--gr);border-bottom:1px solid var(--gr);padding-bottom:2px;transition:color .2s,border-color .2s}
.v-exam2 .ex2-hd .out:hover{color:var(--g);border-color:var(--g)}
.v-exam2 .ex2-bar{height:2px;background:#EEF0F2;position:relative}
.v-exam2 .ex2-bar i{position:absolute;left:0;top:0;height:2px;background:var(--g);transition:width .3s ease}
.v-exam2 .ex2-main{flex:1;width:100%;max-width:1440px;margin:0 auto;padding:78px 160px 70px;display:flex;flex-direction:column}
.v-exam2 .meta{display:flex;align-items:baseline;gap:18px}
.v-exam2 .meta .no{font-family:'Diph','Diphylleia',serif;font-size:26px;letter-spacing:.06em;color:var(--g)}
.v-exam2 .meta .no b{font-weight:400;color:var(--fd)}
.v-exam2 .meta .part{font-family:'CC Title',sans-serif;font-size:15px;color:var(--gr)}
.v-exam2 .q{font-family:'CC Title',sans-serif;font-weight:400;font-size:48px;letter-spacing:-.02em;line-height:1.25;margin:34px 0 0;word-break:keep-all}
.v-exam2 .q span{color:var(--g);margin-right:14px}
.v-exam2 .q em{font-style:normal}
.v-exam2 .ans{display:grid;grid-template-columns:repeat(5,1fr);margin-top:110px;position:relative}
.v-exam2 .ans:before{content:"";position:absolute;left:10%;right:10%;top:31px;height:1px;background:#E3E8E6}
.v-exam2 .o{all:unset;box-sizing:border-box;position:relative;display:flex;flex-direction:column;align-items:center;gap:20px;cursor:pointer}
.v-exam2 .o .c{width:62px;height:62px;border-radius:50%;background:#fff;border:1.5px solid var(--ln);display:grid;place-items:center;font-family:'Diph','Diphylleia',serif;font-size:24px;color:var(--fd);transition:transform .2s,background .2s,border-color .2s,color .2s,box-shadow .2s}
.v-exam2 .o .l{font-family:'CC Title',sans-serif;font-size:20px;color:var(--fd);padding-bottom:10px;position:relative;transition:color .2s}
.v-exam2 .o .l:after{content:"";position:absolute;left:50%;bottom:0;width:0;height:3px;border-radius:2px;background:var(--g);transform:translateX(-50%);transition:width .2s}
.v-exam2 .o:hover .c,.v-exam2 .o:focus-visible .c{border-color:var(--g);color:var(--g);transform:translateY(-4px);box-shadow:0 10px 22px rgba(26,115,83,.16)}
.v-exam2 .o:hover .l,.v-exam2 .o:focus-visible .l{color:#111}
.v-exam2 .o.on .c{background:var(--g);border-color:var(--g);color:#fff;transform:scale(1.08);box-shadow:0 10px 24px rgba(26,115,83,.28)}
.v-exam2 .o.on .l{color:var(--g)}.v-exam2 .o.on .l:after{width:26px}
.v-exam2 .o:focus-visible{outline:2px solid var(--g);outline-offset:6px;border-radius:12px}
.v-exam2 .exft{margin-top:auto;padding-top:120px;display:flex;align-items:center;justify-content:space-between}
.v-exam2 .lnk{all:unset;cursor:pointer;font-family:'CC Title',sans-serif;font-size:17px;color:var(--gr);border-bottom:1px solid var(--gr);padding-bottom:2px;transition:color .2s,border-color .2s}
.v-exam2 .lnk:hover:not(:disabled),.v-exam2 .next.on{color:var(--g);border-color:var(--g)}
.v-exam2 .lnk:disabled{opacity:.35;cursor:default}
.v-exam2 .lnk:focus-visible{outline:2px solid var(--g);outline-offset:4px}
.v-exam2 .cnt{font-family:'CC Body',sans-serif;font-size:15px;color:#9AA0A6}
.v-exam2 .cnt b{font-weight:400}
.v-exam2 .done .en{font-family:'Diph','Diphylleia',serif;font-size:18px;letter-spacing:.06em;color:var(--g)}
.v-exam2 .done p{margin:22px 0 0;font-size:17px;color:var(--gr)}
.v-exam2 .done .sub{all:unset;cursor:pointer;margin-top:44px;display:inline-grid;place-items:center;height:60px;padding:0 34px;border-radius:30px;background:var(--g);color:#fff;font-family:'CC Title',sans-serif;font-size:19px;transition:transform .2s,box-shadow .2s}
.v-exam2 .done .sub:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(26,115,83,.28)}
@media (max-width:1100px){
  .v-exam2 .ex2-hd{height:96px}.v-exam2 .ex2-hd .lg img{left:16px;top:14px;width:132px}.v-exam2 .ex2-hd .out{right:20px;top:38px;font-size:15px}
  .v-exam2 .ex2-main{padding:44px 20px 36px}
  .v-exam2 .meta .no{font-size:20px}.v-exam2 .q{font-size:28px;margin-top:20px}
  .v-exam2 .ans{margin-top:56px}.v-exam2 .o{gap:12px}.v-exam2 .o .c{width:46px;height:46px;font-size:18px}.v-exam2 .ans:before{top:23px}
  .v-exam2 .o .l{font-size:13px;text-align:center;word-break:keep-all}
  .v-exam2 .exft{padding-top:60px}.v-exam2 .lnk{font-size:15px}.v-exam2 .cnt{font-size:13px}
}

/* =========================================================================
   40 admin — 관리자 화면 (뿌리 .v-admin 아래만)
   ========================================================================= */
.v-admin p,.v-admin .help{word-break:keep-all}
.v-admin .mb20{margin-bottom:20px}
.v-admin .mb24{margin-bottom:24px}
.v-admin .note{margin-top:14px}
.v-admin .ulink{color:var(--green);text-decoration:underline}
.v-admin .empty-card{margin-top:0;border:1.5px dashed var(--line2)}
.v-admin .empty-card .empty{padding:28px 16px}
.v-admin .card>.empty{padding:40px 16px}

/* 페이지 번호: 끝 쪽 비활성 · 생략 기호 */
.v-admin .pager a.off{opacity:.35;pointer-events:none}
.v-admin .pager .gap{min-width:24px;text-align:center;color:var(--sub);font-size:14px}

/* 잔여 건수 알약 */
.v-admin .remain{display:inline-flex;align-items:baseline;background:var(--info-bg);color:var(--info);border-radius:999px;padding:8px 16px;font-size:14px;white-space:nowrap}
.v-admin .remain b{margin:0 2px 0 6px;font-weight:400;font-family:var(--f-title);font-size:16px}

/* 열이 많은 표 */
.v-admin .tbl.tight th,.v-admin .tbl.tight td{padding-left:10px;padding-right:10px}
.v-admin .tbl.tight .actions{gap:4px}
.v-admin .tbl.tight .actions .btn.sm{padding:7px 11px}

/* 범례 */
.v-admin .legend{display:flex;gap:6px 14px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--sub)}
.v-admin .legend b{font-weight:400;color:var(--ink2);font-family:var(--f-title)}

/* ---------- 답안 · 문항 표 ---------- */
.v-admin .who-dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0}
.v-admin .who-dl>div{padding:4px 24px;border-left:1px solid var(--line);min-width:0}
.v-admin .who-dl>div:first-child{padding-left:0;border-left:0}
.v-admin .who-dl dt{font-size:12px;color:var(--sub);margin-bottom:4px}
.v-admin .who-dl dd{margin:0;font-size:18px}
.v-admin .who-dl dd.t{font-size:20px}
.v-admin .tbl td.qno{width:72px;color:var(--sub)}
.v-admin .tbl td.q{white-space:normal;min-width:320px;color:var(--ink)}
.v-admin .tbl td.a{width:260px}
.v-admin .tbl td.grpc{width:200px}
.v-admin .ans{display:flex;align-items:center;gap:14px}
.v-admin .scale{display:inline-flex;align-items:center;gap:5px;flex:none}
.v-admin .scale i{width:9px;height:9px;border-radius:50%;background:var(--bg3);box-shadow:inset 0 0 0 1px var(--line2)}
.v-admin .scale i.on{width:13px;height:13px;background:var(--green);box-shadow:0 0 0 3px var(--green-l)}
.v-admin .ans .lab{display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap}
.v-admin .ans .lab b{font-family:var(--f-title);font-weight:400;font-size:16px;color:var(--green)}
.v-admin .tbl tr.grp td{background:var(--bg2);padding:10px 14px;font-size:13px;color:var(--ink2)}
.v-admin .tbl tr.grp td .en{color:var(--green);font-size:13px;margin-right:8px}
.v-admin .tbl tbody tr.grp:hover td{background:var(--bg2)}
.v-admin .axis{display:inline-flex;align-items:center;gap:8px}
.v-admin .axis .code{min-width:30px;padding:2px 8px;font-size:13px}

/* ---------- 회원/재무관리자 폼 ---------- */
.v-admin .role-tag{font-size:11px;padding:1px 8px;margin-left:6px;vertical-align:1px}
.v-admin .approve-cell{justify-content:flex-end;padding-bottom:12px}
.v-admin .field .err[hidden]{display:none}

/* ---------- 초대 링크 ---------- */
.v-admin .invite .input{font-variant-numeric:tabular-nums;min-width:0}

/* ---------- FP 적합도 목록 ---------- */
.v-admin .fit{display:flex;align-items:center;gap:12px;min-width:180px}
.v-admin .fit b{font-family:var(--f-title);font-weight:400;font-size:17px;min-width:56px}
.v-admin .fit .bar{flex:1;height:8px;max-width:120px}
.v-admin .who{display:flex;flex-direction:column;line-height:1.35}
.v-admin .who span{font-size:12px;color:var(--sub)}
.v-admin .typ,.v-admin .st{display:inline-flex;align-items:center;gap:8px}

/* ---------- 문자: 탭 ---------- */
.v-admin .smsbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:24px}
.v-admin .subtabs{display:flex;gap:6px;flex-wrap:wrap}
.v-admin .subtabs a{padding:9px 18px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line2);font-size:14px;color:var(--ink2);white-space:nowrap}
.v-admin .subtabs a:hover{box-shadow:inset 0 0 0 1.5px var(--ink2)}
.v-admin .subtabs a.on{background:var(--ink);color:#fff;box-shadow:none}

/* 발송 (기본) */
.v-admin .sms-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px;align-items:stretch}
.v-admin .sms-grid>form.card{display:flex;flex-direction:column}
.v-admin .sms-grid>form.card .form-actions{margin-top:auto;padding-top:28px}
.v-admin .step{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--green-l);color:var(--green);font-family:var(--f-title);font-size:13px;flex:none}
.v-admin .card-h .ttl{display:flex;align-items:center;gap:10px}
.v-admin .card .search .box{width:240px}
.v-admin .select[disabled]{background-color:var(--bg2);color:var(--sub)}

/* 발송 (선택 회원) */
.v-admin .sel-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:32px;align-items:start}
.v-admin .pv{background:var(--bg2);border-radius:var(--r-box);padding:18px}
.v-admin .pv-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;font-size:13px;color:var(--sub)}
.v-admin .bubble{background:#fff;border-radius:18px 18px 18px 6px;padding:14px 16px;font-size:14px;line-height:1.65;box-shadow:0 2px 8px rgba(17,19,24,.05);white-space:pre-wrap;word-break:keep-all;overflow-wrap:anywhere}
.v-admin .bubble .sub{display:block;font-family:var(--f-title);font-size:14px;margin-bottom:6px;color:var(--ink)}
.v-admin .bubble mark,.v-admin .msg mark{background:var(--green-l);color:var(--green-d);border-radius:4px;padding:0 3px}
.v-admin .bubble.empty-msg{color:var(--sub)}

/* 내역 */
.v-admin .filter{display:flex;gap:8px;align-items:center}
.v-admin .filter .select{width:220px;padding:9px 40px 9px 16px;border-radius:999px;font-size:14px}
.v-admin .clip{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;color:var(--ink2);max-width:520px}
.v-admin .tbl td.wrap{min-width:280px}

/* 잔여 건수 */
.v-admin .stat{display:flex;flex-direction:column;gap:6px;position:relative}
.v-admin .stat .k{display:flex;justify-content:space-between;align-items:center;gap:8px}
.v-admin .stat .k .en{font-size:20px;color:var(--ink2)}
.v-admin .stat .v{font-family:var(--f-title);font-size:44px;line-height:1.1;letter-spacing:-.01em}
.v-admin .stat .v small{font-family:var(--f-body);font-size:16px;color:var(--sub);margin-left:4px}
.v-admin .stat.main-s{box-shadow:inset 0 0 0 2px var(--green),var(--shadow)}
.v-admin .stat.main-s .v{color:var(--green)}

/* 템플릿 */
.v-admin .tname{font-family:var(--f-title);font-size:15px}
.v-admin .tf-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:32px;align-items:start}
.v-admin .label .req{color:var(--F);margin-left:2px}
.v-admin .chips{display:flex;gap:6px;flex-wrap:wrap}
.v-admin .chip{border:0;background:var(--green-l);color:var(--green);border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;font-family:var(--f-body)}
.v-admin .chip:hover{background:#d3ecdf}
.v-admin .help-box{word-break:keep-all;background:var(--bg2);border-radius:12px;padding:12px 14px;font-size:13px;color:var(--ink2);line-height:1.65}
.v-admin .help-box code{font-family:inherit;background:#fff;border-radius:6px;padding:1px 6px;color:var(--green-d)}
.v-admin .pv-wrap{position:sticky;top:96px}
.v-admin .pv-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.v-admin .pv-label .en{color:var(--green);font-size:14px}
.v-admin .phone{background:var(--ink);border-radius:40px;padding:12px;box-shadow:var(--shadow-lg)}
.v-admin .screen{background:#F2F3F5;border-radius:30px;overflow:hidden;min-height:440px;display:flex;flex-direction:column}
.v-admin .ph-top{background:#fff;padding:16px 18px 12px;text-align:center;border-bottom:1px solid var(--line)}
.v-admin .ph-top .notch{width:90px;height:6px;border-radius:6px;background:var(--bg3);margin:0 auto 12px}
.v-admin .ph-top b{display:block;font-weight:400;font-size:14px}
.v-admin .ph-top span{font-size:12px;color:var(--sub)}
.v-admin .ph-body{flex:1;padding:18px 14px;display:flex;flex-direction:column;gap:6px}
.v-admin .ph-body .day{align-self:center;font-size:11px;color:var(--sub);background:#E6E8EC;border-radius:999px;padding:2px 10px;margin-bottom:8px}
.v-admin .msg{align-self:flex-start;max-width:92%;background:#fff;border-radius:18px 18px 18px 6px;padding:12px 14px;font-size:13.5px;line-height:1.65;white-space:pre-wrap;word-break:keep-all;overflow-wrap:anywhere;box-shadow:0 1px 2px rgba(17,19,24,.06)}
.v-admin .msg .sub{display:block;font-family:var(--f-title);margin-bottom:6px}
.v-admin .msg.empty-msg{color:var(--sub)}
.v-admin .ph-meta{font-size:11px;color:var(--sub);padding-left:4px}
.v-admin .sample{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:12px;color:var(--sub);margin:14px 0 0}
.v-admin .sample dd{margin:0;color:var(--ink2);word-break:break-all}

/* 검사 신청 */
.v-admin .tbl tr.new td:first-child{box-shadow:inset 3px 0 0 var(--warn)}
.v-admin .tbl td.memo{min-width:200px;max-width:320px;color:var(--ink2)}

/* ---------- 반응형 ---------- */
@media (max-width:1080px){
  .v-admin .sms-grid,.v-admin .sel-grid,.v-admin .tf-grid{grid-template-columns:minmax(0,1fr)}
  .v-admin .pv-wrap{position:static;max-width:380px;width:100%;margin:0 auto}
}
@media (max-width:900px){
  .v-admin .who-dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 0}
  .v-admin .who-dl>div:nth-child(3){padding-left:0;border-left:0}
}
@media (max-width:720px){
  .v-admin .invite{flex-direction:column;align-items:stretch}
  .v-admin .invite .btn{width:100%}
  .v-admin .search{width:100%}
  .v-admin .search .box,.v-admin .card .search .box{flex:1;width:auto;min-width:0}
  .v-admin .card-h .search{width:100%}
  .v-admin .approve-cell{padding-bottom:0}
  .v-admin .stack-m .tbl tr.grp{background:none;border:0;padding:12px 2px 2px;margin:0}
  .v-admin .stack-m .tbl tr.grp td{background:none;padding:0 4px}
  .v-admin .stack-m .tbl tr.grp td::before{display:none}
  .v-admin .stack-m .tbl td.q,.v-admin .stack-m .tbl td.wrap,.v-admin .stack-m .tbl td.memo{min-width:0;max-width:none;white-space:normal}
  .v-admin .stack-m .tbl td.qno,.v-admin .stack-m .tbl td.a,.v-admin .stack-m .tbl td.grpc,.v-admin .stack-m .tbl td.w-check{width:100%}
  .v-admin .stack-m .tbl tr.new td:first-child{box-shadow:none}
  .v-admin .stack-m .tbl .actions{flex-wrap:wrap}
  .v-admin .stack-m .fit .bar{max-width:none}
  .v-admin .who-dl dd,.v-admin .who-dl dd.t{font-size:16px}
  .v-admin .who-dl>div{padding:4px 12px}
  .v-admin .who-dl>div:nth-child(odd){padding-left:0;border-left:0}
  .v-admin .stack-m .tbl td.wrap{flex-wrap:nowrap}
  .v-admin .stack-m .tbl td>*{min-width:0}
  .v-admin .filter{width:100%}
  .v-admin .filter .select{flex:1;width:auto}
  .v-admin .clip{-webkit-line-clamp:3}
  .v-admin .stat .v{font-size:36px}
  .v-admin .table-foot{flex-direction:column;align-items:stretch}
  .v-admin .table-foot .pager{justify-content:center}
}

/* =========================================================================
   50 reports — A4 리포트 3종 (재무심리 8쪽 · 매칭 6쪽 · FP 적합도 5쪽)
   시안 assets/a4.css 를 그대로 옮기고 모든 선택자를 .v-a4 아래로 묶었다.
   한 페이지 = <section class="a4"> (210×297mm). 인쇄 때는 페이지만 나온다.
   ========================================================================= */
@page{size:A4;margin:0}
.v-a4{-webkit-print-color-adjust:exact;print-color-adjust:exact}
.v-a4{background:#C9CED6;font-size:9.5pt;line-height:1.55;color:var(--ink)}
.v-a4 .a4-toolbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 24px;background:rgba(17,19,24,.88);backdrop-filter:blur(8px);color:#fff}
.v-a4 .a4-toolbar .t{font-family:var(--f-body);font-size:14px;display:flex;align-items:center;gap:10px}
.v-a4 .a4-toolbar .t img{height:20px}
.v-a4 .a4-toolbar .t span{color:#AEB4BF;font-size:12px}
.v-a4 .a4-toolbar .btns .btn{padding:8px 16px;font-size:13px}
.v-a4 .a4-toolbar .btn.secondary{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}
.v-a4 .a4-toolbar .btn.mint{background:var(--mint);color:var(--ink)}
.v-a4 .a4-stack{padding:28px 0 60px;display:flex;flex-direction:column;align-items:center;gap:28px}
.v-a4 .a4{position:relative;width:210mm;height:297mm;background:#fff;box-shadow:0 10px 36px rgba(17,19,24,.22);overflow:hidden;display:flex;flex-direction:column;padding:15mm 16mm 0}
.v-a4 .a4-main{flex:1;min-height:0;display:flex;flex-direction:column}
.v-a4 .a4-ft{flex:none;height:13mm;display:flex;justify-content:space-between;align-items:center;border-top:.6pt solid var(--line);font-size:8pt;color:var(--sub);margin-top:4mm}
.v-a4 .a4-ft b{font-weight:400;color:var(--green);font-family:var(--f-title)}
@media print{
.v-a4{background:none}
.v-a4 .a4-toolbar,.v-a4 .screen-tag{display:none!important}
.v-a4 .a4-stack{padding:0;gap:0;display:block}
.v-a4 .a4{box-shadow:none;margin:0;break-after:page;page-break-after:always}
.v-a4 .a4:last-child{break-after:auto;page-break-after:auto}
}
.v-a4 .a4-hd{flex:none;display:flex;align-items:center;gap:4mm;margin-bottom:6mm}
.v-a4 .a4-hd .no{flex:none;width:12mm;height:12mm;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-family:var(--f-title);font-size:13pt}
.v-a4 .a4-hd .en{display:block;font-size:9pt;color:var(--green);letter-spacing:.14em}
.v-a4 .a4-hd h2{font-size:19pt;line-height:1.2}
.v-a4 .a4-hd .side{margin-left:auto;text-align:right;font-size:8pt;color:var(--sub)}
.v-a4 .lead{font-size:10pt;color:var(--ink2);line-height:1.7}
.v-a4 .lead+.lead{margin-top:3mm}
.v-a4 .lead.it{font-style:italic;color:var(--sub)}
.v-a4 .note{font-size:8pt;color:var(--sub);line-height:1.55}
.v-a4 .sec-h{display:flex;align-items:center;gap:2.5mm;font-family:var(--f-title);font-size:12pt;margin:6mm 0 3mm}
.v-a4 .sec-h::before{content:"";width:1.4mm;height:4.4mm;border-radius:1mm;background:var(--green)}
.v-a4 .sec-h small{font-family:var(--f-body);font-size:8.5pt;color:var(--sub);margin-left:1mm}
.v-a4 .mt-a{margin-top:auto!important}
.v-a4 .banner{background:linear-gradient(135deg,var(--green),#0F4D37);color:#fff;border-radius:5mm;padding:6mm 7mm;position:relative;overflow:hidden}
.v-a4 .banner::after{content:"";position:absolute;right:-14mm;top:-14mm;width:46mm;height:46mm;border-radius:50%;border:7mm solid rgba(155,255,249,.10)}
.v-a4 .banner .k{font-size:10pt;opacity:.9}
.v-a4 .banner .code-big{font-family:var(--f-title);font-size:30pt;color:var(--mint);line-height:1;margin:0 1.5mm}
.v-a4 .banner .d{font-size:10pt;margin-top:2.5mm;color:#D7F5EA}
.v-a4 .stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:4mm}
.v-a4 .stat{background:var(--bg2);border-radius:3.5mm;padding:4mm 5mm}
.v-a4 .stat .k{font-size:8.5pt;color:var(--sub)}
.v-a4 .stat .v{font-family:var(--f-title);font-size:19pt;line-height:1.2;margin-top:1mm}
.v-a4 .stat .v small{font-family:var(--f-body);font-size:9pt;margin-left:1mm;color:var(--ink2)}
.v-a4 .stat .s{font-size:8pt;color:var(--sub);margin-top:.6mm}
.v-a4 .stat.risk .v{color:var(--low)}
.v-a4 .stat.gold{background:#FDF6E3}
.v-a4 .stat.gold .v{color:#8A6D1A}
.v-a4 .insight{background:var(--green-l);border-radius:4mm;padding:5mm 6mm}
.v-a4 .insight .h{font-size:10pt;color:var(--green-d)}
.v-a4 .insight .h b{font-family:var(--f-title);font-weight:400;font-size:12pt;margin-left:1.5mm}
.v-a4 .insight .b{font-size:9.5pt;color:var(--ink2);margin-top:1.5mm}
.v-a4 .box{border:.75pt solid var(--line2);border-radius:4mm;padding:5mm 6mm}
.v-a4 .box.tint{background:var(--bg2);border-color:transparent}
.v-a4 .box .h{font-family:var(--f-title);font-size:11pt;color:var(--green)}
.v-a4 .hl{background:var(--green-l);border-left:1.6mm solid var(--green);border-radius:0 4mm 4mm 0;padding:4mm 6mm}
.v-a4 .hl .k{font-size:8.5pt;color:var(--green-d)}
.v-a4 .hl .v{font-family:var(--f-title);font-size:17pt;line-height:1.3}
.v-a4 .hl .d{font-size:9.5pt;color:var(--ink2);font-style:italic}
.v-a4 .chart{display:block;width:100%;height:auto}
.v-a4 .legend{display:flex;justify-content:center;gap:7mm;font-size:8.5pt;color:var(--ink2);margin-top:1mm}
.v-a4 .legend i{display:inline-block;width:3mm;height:3mm;border-radius:50%;margin-right:1.5mm;vertical-align:-.3mm}
.v-a4 .legend i.dash{width:6mm;height:0;border-radius:0;border-top:1.4pt dashed var(--low);vertical-align:.8mm}
.v-a4 table.rt{width:100%;border-collapse:collapse;font-size:9pt}
.v-a4 .rt th{background:var(--bg2);color:var(--sub);font-weight:400;font-size:8.5pt;padding:2.2mm 2mm;border-bottom:.75pt solid var(--line2);text-align:center}
.v-a4 .rt td{padding:1.9mm 2mm;border-bottom:.6pt solid var(--line);text-align:center;vertical-align:middle;font-variant-numeric:tabular-nums}
.v-a4 .rt td.l,.v-a4 .rt th.l{text-align:left}
.v-a4 .rt tr.on td{background:#E8F6EE}
.v-a4 .rt tr.on td:first-child{box-shadow:inset 1.2mm 0 0 var(--green)}
.v-a4 .rt b{font-weight:400;font-family:var(--f-title)}
.v-a4 .rt .up{color:var(--low)}
.v-a4 .rt .dn{color:var(--ink2)}
.v-a4 .tag{display:inline-block;border-radius:999px;padding:.4mm 2.6mm;font-size:8pt;line-height:1.6}
.v-a4 .tag.safe{background:var(--safe-bg);color:var(--safe)}
.v-a4 .tag.low{background:var(--low-bg);color:var(--low)}
.v-a4 .tag.warn{background:var(--warn-bg);color:var(--warn)}
.v-a4 .side-dot{display:inline-block;width:2mm;height:2mm;border-radius:50%;margin-right:1.4mm;vertical-align:.1mm}
.v-a4 .a4.dark{background:linear-gradient(160deg,#1A7353 0%,#145C42 45%,#0F4D37 100%);color:#fff}
.v-a4 .a4.dark .a4-ft{border-top-color:rgba(255,255,255,.18);color:rgba(255,255,255,.65)}
.v-a4 .a4.dark .a4-ft b{color:var(--mint)}
.v-a4 .a4.dark .a4-hd .no{background:var(--mint);color:var(--green-d)}
.v-a4 .a4.dark .a4-hd .en{color:var(--mint)}
.v-a4 .cv-top{display:flex;align-items:center;gap:3mm}
.v-a4 .cv-top img{height:9mm}
.v-a4 .cv-top .wm{font-family:var(--f-title);font-size:14pt;letter-spacing:.01em}
.v-a4 .cv-top .wm b{font-weight:400;color:var(--mint)}
.v-a4 .cv-top .r{margin-left:auto;font-family:var(--f-en);font-size:9pt;letter-spacing:.18em;color:var(--mint)}
.v-a4 .cv-art{position:absolute;right:-30mm;top:58mm;width:150mm;opacity:.08;pointer-events:none}
.v-a4 .cv-ring{position:absolute;right:-40mm;top:40mm;width:150mm;height:150mm;border-radius:50%;border:16mm solid rgba(155,255,249,.06);pointer-events:none}
.v-a4 .cv-body{margin-top:52mm;position:relative}
.v-a4 .cv-brand{font-family:var(--f-en);font-size:13pt;letter-spacing:.24em;color:var(--mint)}
.v-a4 .cv-title{font-family:var(--f-title);font-size:38pt;line-height:1.18;margin-top:4mm}
.v-a4 .cv-rule{width:22mm;height:1.6mm;border-radius:1mm;background:var(--mint);margin:8mm 0 7mm}
.v-a4 .cv-copy{font-size:11pt;line-height:1.75;color:#D7F5EA}
.v-a4 .cv-name{margin-top:14mm;display:flex;align-items:baseline;gap:3mm}
.v-a4 .cv-name b{font-family:var(--f-title);font-weight:400;font-size:22pt}
.v-a4 .cv-name span{font-size:11pt;color:#D7F5EA}
.v-a4 .cv-meta{font-size:9pt;color:rgba(255,255,255,.65);margin-top:1.5mm}
.v-a4 .cv-bar{margin-top:auto;display:grid;grid-template-columns:repeat(3,1fr);background:rgba(255,255,255,.08);border:.75pt solid rgba(155,255,249,.25);border-radius:5mm;overflow:hidden}
.v-a4 .cv-bar>div{padding:5mm 6mm}
.v-a4 .cv-bar>div+div{border-left:.75pt solid rgba(155,255,249,.2)}
.v-a4 .cv-bar .k{font-size:8.5pt;color:rgba(255,255,255,.7)}
.v-a4 .cv-bar .v{font-family:var(--f-title);font-size:20pt;color:var(--mint);margin-top:1mm;line-height:1.2}
.v-a4 .cv-bar .v small{font-size:11pt;color:#fff;margin-left:1mm}
.v-a4 .cv-org{display:flex;justify-content:space-between;align-items:center;margin:6mm 0 4mm;font-size:9pt;color:rgba(255,255,255,.75)}
.v-a4 .cv-org b{font-family:var(--f-title);font-weight:400;font-size:11pt;color:#fff;letter-spacing:.02em}
.v-a4 .steps{display:flex;align-items:center;justify-content:center;gap:6mm;margin:8mm 0}
.v-a4 .steps .st{display:flex;flex-direction:column;align-items:center;gap:2.5mm}
.v-a4 .steps .c{width:24mm;height:24mm;border-radius:50%;border:1.2mm solid var(--green);color:var(--green);display:grid;place-items:center;font-family:var(--f-title);font-size:20pt}
.v-a4 .steps .c.on{background:var(--green);color:var(--mint)}
.v-a4 .steps .lb{font-family:var(--f-title);font-size:11.5pt}
.v-a4 .steps .ar{color:var(--line2);font-size:22pt;margin-bottom:8mm}
.v-a4 .fate{background:var(--ink);color:#fff;border-radius:5mm;padding:7mm 8mm}
.v-a4 .fate .a{font-family:var(--f-title);font-size:15pt}
.v-a4 .fate .b{font-size:11pt;color:var(--mint);margin-top:2mm}
.v-a4 .rt.therapy td{text-align:left;vertical-align:top;line-height:1.6;padding:4.2mm 2mm;font-size:9.5pt}
.v-a4 .rt.therapy td:first-child{white-space:nowrap}
.v-a4 .rt.therapy .pm{display:block;font-size:8pt;color:var(--sub);font-family:var(--f-body)}
.v-a4 .rt.therapy .grp td{background:var(--bg3);font-size:8pt;color:var(--sub);padding:1.4mm 2mm}
.v-a4 .msig-top{display:grid;grid-template-columns:84mm 1fr;gap:6mm;align-items:start}
.v-a4 .headmap{background:var(--bg2);border-radius:5mm;padding:3mm 4mm 4mm}
.v-a4 .headmap svg{display:block;width:70mm;margin:0 auto}
.v-a4 .grade-list{display:grid;grid-template-columns:1fr;gap:1.2mm;margin-top:2mm;font-size:8.5pt}
.v-a4 .grade-list span{display:flex;align-items:center;gap:1.5mm;white-space:nowrap}
.v-a4 .grade-list i{flex:none;width:4mm;height:4mm;border-radius:50%;color:#fff;font-style:normal;display:grid;place-items:center;font-size:8pt;line-height:1}
.v-a4 .type-ban{background:linear-gradient(135deg,var(--green),#0F4D37);color:#fff;border-radius:5mm;padding:6mm 7mm}
.v-a4 .type-ban .c{font-family:var(--f-title);font-size:36pt;color:var(--mint);line-height:1}
.v-a4 .type-ban .t{font-family:var(--f-title);font-size:15pt;margin-top:1mm}
.v-a4 .pills{display:grid;grid-template-columns:repeat(4,1fr);gap:3mm}
.v-a4 .pills span{border-radius:999px;text-align:center;padding:2mm 0;font-family:var(--f-title);font-size:11pt}
.v-a4 .pills .ok{background:var(--safe-bg);color:var(--safe)}
.v-a4 .pills .no{background:var(--warn-bg);color:var(--warn)}
.v-a4 .tgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:3mm}
.v-a4 .tgrid .tl{position:relative;height:34mm;border-radius:4mm;display:grid;place-items:center;font-family:var(--f-title);font-size:16pt}
.v-a4 .tgrid .tl .r{position:absolute;left:3mm;top:2mm;font-family:var(--f-body);font-size:8.5pt;opacity:.75}
.v-a4 .tgrid .t1{background:#E3F3EA;color:#2B7A50}
.v-a4 .tgrid .t2{background:#E4F1F6;color:#2E6F8E}
.v-a4 .tgrid .t3{background:#FDF0DC;color:#9A6B08}
.v-a4 .tgrid .t4{background:#FBEAE6;color:#B5432A}
.v-a4 .tgrid .t4 .none{font-size:11pt}
.v-a4 .tgrid .you{background:var(--green);color:#fff;box-shadow:0 0 0 1mm var(--mint) inset}
.v-a4 .tgrid .you .tag-you{position:absolute;right:2.5mm;top:2.2mm;background:var(--mint);color:var(--green-d);border-radius:999px;font-size:8pt;padding:0 2mm;font-family:var(--f-en);letter-spacing:.08em}
.v-a4 .tier-lg{display:flex;gap:5mm;font-size:8pt;color:var(--sub);margin-top:2.5mm}
.v-a4 .tier-lg i{display:inline-block;width:3mm;height:3mm;border-radius:1mm;margin-right:1.2mm;vertical-align:-.3mm}
.v-a4 .bul{list-style:none;padding:0;margin:0;font-size:9.5pt;color:var(--ink2);line-height:1.9}
.v-a4 .bul li::before{content:"·";color:var(--green);margin-right:2mm;font-weight:700}
.v-a4 .letters{display:grid;grid-template-columns:repeat(4,1fr);gap:3mm;margin-top:3mm}
.v-a4 .letters span{background:var(--bg2);border-radius:3mm;padding:2.5mm 3mm;font-size:9pt;display:flex;align-items:center;gap:2mm}
.v-a4 .letters b{font-family:var(--f-title);font-weight:400;font-size:13pt;color:var(--green)}
.v-a4 .you-card{display:flex;align-items:center;gap:4mm;background:var(--green-l);border-radius:4mm;padding:5mm 6mm;font-size:11.5pt}
.v-a4 .you-card .code{font-size:13pt;background:var(--green);color:#fff;border-radius:2.5mm;padding:1.5mm 3mm}
.v-a4 .cl-quote{font-family:var(--f-title);font-size:25pt;line-height:1.45;margin-top:28mm}
.v-a4 .cl-quote em{font-style:normal;color:var(--mint)}
.v-a4 .cl-body{font-size:11pt;line-height:1.85;color:#D7F5EA;margin-top:9mm;max-width:150mm}
.v-a4 .cl-goal{margin-top:10mm;border:.75pt solid rgba(155,255,249,.4);background:rgba(255,255,255,.06);border-radius:5mm;padding:6mm 7mm;font-size:11pt;display:flex;gap:3mm;align-items:center}
.v-a4 .cl-goal::before{content:"";flex:none;width:3mm;height:3mm;border-radius:50%;background:var(--mint)}
.v-a4 .match{--pa:#1A7353;--pb:#3A6FC4;--coral:#E4572E}
.v-a4 .cv-pair{font-size:15pt;margin-top:10mm}
.v-a4 .cv-pair b{font-family:var(--f-title);font-weight:400;font-size:22pt}
.v-a4 .cv-pair .x{color:var(--mint);margin:0 3mm}
.v-a4 .cv-match{margin-top:12mm;display:flex;align-items:center;gap:8mm}
.v-a4 .cv-match .ringbox{width:46mm;flex:none}
.v-a4 .cv-match .k{font-size:10pt;color:#D7F5EA}
.v-a4 .cv-match .v{font-family:var(--f-title);font-size:20pt;color:var(--mint)}
.v-a4 .cv-chips{display:flex;flex-direction:column;gap:2.5mm;margin-top:4mm}
.v-a4 .cv-chips span{display:inline-flex;align-items:center;gap:2mm;background:rgba(255,255,255,.1);border:.75pt solid rgba(255,255,255,.2);border-radius:999px;padding:1.6mm 4.5mm;font-size:9.5pt;width:max-content}
.v-a4 .cv-chips i{width:2.6mm;height:2.6mm;border-radius:50%}
.v-a4 .who{display:inline-flex;align-items:center;gap:1.6mm}
.v-a4 .who i{width:2.6mm;height:2.6mm;border-radius:50%;display:inline-block}
.v-a4 .dot-a{background:var(--pa)}
.v-a4 .dot-b{background:var(--pb)}
.v-a4 .dot-c{background:var(--coral)}
.v-a4 .pcards{display:grid;grid-template-columns:1fr 1fr;gap:5mm}
.v-a4 .pcard{border-radius:5mm;padding:5mm 6mm;border:.75pt solid var(--line2);border-top:2mm solid var(--pa);position:relative}
.v-a4 .pcard.b{border-top-color:var(--pb)}
.v-a4 .pcard .who-l{display:flex;justify-content:space-between;align-items:center;font-size:9pt;color:var(--sub)}
.v-a4 .pcard .who-l .ab{font-family:var(--f-title);font-size:10pt;color:#fff;background:var(--pa);border-radius:999px;width:6mm;height:6mm;display:grid;place-items:center}
.v-a4 .pcard.b .who-l .ab{background:var(--pb)}
.v-a4 .pcard .nm{font-family:var(--f-title);font-size:15pt;margin-top:1.5mm}
.v-a4 .pcard .mind{font-size:10pt;color:var(--ink2)}
.v-a4 .pcard .ty{display:inline-block;font-family:var(--f-title);font-size:12pt;color:var(--pa);background:var(--green-l);border-radius:2mm;padding:.6mm 2.6mm;margin-top:2mm}
.v-a4 .pcard.b .ty{color:var(--pb);background:var(--info-bg)}
.v-a4 .trip{display:grid;grid-template-columns:repeat(3,1fr);gap:2mm;margin-top:4mm}
.v-a4 .trip div{background:var(--bg2);border-radius:2.5mm;padding:2.4mm 3mm;font-size:8pt;color:var(--sub)}
.v-a4 .trip b{display:block;font-family:var(--f-title);font-weight:400;font-size:13pt;color:var(--ink)}
.v-a4 .trip b.risk{color:var(--coral)}
.v-a4 .inkbox{background:var(--ink);color:#fff;border-radius:5mm;padding:5.5mm 7mm}
.v-a4 .inkbox small{display:block;font-size:8.5pt;color:var(--mint);letter-spacing:.04em}
.v-a4 .inkbox p{font-size:11.5pt;margin-top:1.5mm;line-height:1.6}
.v-a4 .inkbox .roles{display:flex;align-items:center;justify-content:center;gap:6mm;margin:3mm 0}
.v-a4 .inkbox .roles p{margin:0;text-align:center}
.v-a4 .inkbox .roles p b{display:block;font-family:var(--f-title);font-weight:400;font-size:14pt}
.v-a4 .inkbox .roles p span{font-size:9pt;color:#AEB4BF}
.v-a4 .inkbox .roles>b{font-family:var(--f-title);font-weight:400;font-size:20pt;color:var(--mint)}
.v-a4 .inkbox hr{border:0;border-top:.75pt solid rgba(255,255,255,.15);margin:3mm 0}
.v-a4 .bars-grp{margin-top:2mm}
.v-a4 .bars-grp h4{font-size:11pt;display:flex;align-items:baseline;gap:2mm;margin-bottom:2mm}
.v-a4 .bars-grp h4 span{font-family:var(--f-body);font-size:8.5pt;color:var(--sub)}
.v-a4 .brow{display:grid;grid-template-columns:20mm 1fr 11mm 1fr 11mm;align-items:center;gap:2.5mm;padding:4.6mm 1.5mm;border-bottom:.6pt solid var(--line)}
.v-a4 .brow>b{font-family:var(--f-title);font-weight:400;font-size:10pt}
.v-a4 .brow .tr{height:4.6mm;background:var(--bg3);border-radius:999px;position:relative}
.v-a4 .brow .tr s{position:absolute;left:60%;top:-1mm;bottom:-1mm;border-left:.9pt dashed var(--ink2)}
.v-a4 .brow .tr i{position:absolute;left:0;top:0;bottom:0;border-radius:999px}
.v-a4 .brow em{font-style:normal;font-size:10pt;font-variant-numeric:tabular-nums;text-align:right}
.v-a4 .brow.hd{border-bottom:0;padding:0 0 1mm;font-size:8pt;color:var(--sub)}
.v-a4 .brow.on{background:linear-gradient(90deg,#FFF6F2,transparent)}
.v-a4 .brow.sim{background:linear-gradient(90deg,#EEF7F2,transparent)}
.v-a4 .mrow{display:grid;grid-template-columns:11mm 30mm 1fr 12mm;align-items:center;gap:2.5mm;padding:1.6mm 0}
.v-a4 .mrow .L{font-family:var(--f-title);font-size:18pt;color:var(--green);text-align:center}
.v-a4 .mcard{border:.75pt solid var(--line2);border-radius:4mm;padding:4.5mm 5.5mm;margin-bottom:4mm}
.v-a4 .mcard .mt{display:flex;align-items:center;gap:3mm;margin-bottom:1mm}
.v-a4 .mcard .mt .L{font-family:var(--f-title);font-size:20pt;color:var(--green);width:9mm}
.v-a4 .mcard .mt b{font-family:var(--f-title);font-weight:400;font-size:11.5pt}
.v-a4 .mcard .mt .lead-who{margin-left:auto;font-size:8.5pt;color:var(--sub)}
.v-a4 .mcard .ln{display:grid;grid-template-columns:16mm 1fr 12mm;gap:2.5mm;align-items:center;padding:1.8mm 0;font-size:9.5pt}
.v-a4 .mcard .tr{height:5mm;background:var(--bg3);border-radius:999px;position:relative;overflow:hidden}
.v-a4 .mcard .tr i{position:absolute;left:0;top:0;bottom:0;border-radius:999px}
.v-a4 .mcard .tr s{position:absolute;top:-1mm;bottom:-1mm;width:0;border-left:.9pt dashed var(--ink2);text-decoration:none}
.v-a4 .mcard em{font-style:normal;text-align:right;font-variant-numeric:tabular-nums}
.v-a4 .duo{display:grid;grid-template-columns:1fr 1fr;gap:5mm}
.v-a4 .tile{border-radius:4mm;padding:4mm 5mm;background:var(--bg2)}
.v-a4 .tile small{font-size:8.5pt;color:var(--sub)}
.v-a4 .tile b{display:block;font-family:var(--f-title);font-weight:400;font-size:15pt;margin-top:.5mm}
.v-a4 .tile p{font-size:9pt;color:var(--ink2);margin-top:1mm}
.v-a4 .tile.sim{background:var(--green-l)}
.v-a4 .tile.sim b{color:var(--green-d)}
.v-a4 .tile.dif{background:#FDEEE8}
.v-a4 .tile.dif b{color:var(--coral)}
.v-a4 .tog{border-radius:5mm;padding:7mm 7mm 5mm;border:.75pt solid var(--line2)}
.v-a4 .tog .ic{width:9mm;height:9mm;border-radius:50%;display:grid;place-items:center;font-family:var(--f-title);font-size:14pt;color:#fff;background:var(--pa)}
.v-a4 .tog.d .ic{background:var(--coral)}
.v-a4 .tog h3{font-size:13pt;margin:3mm 0 1mm}
.v-a4 .tog .sub{font-size:9pt;color:var(--sub);margin-bottom:3mm}
.v-a4 .tog p.it{display:flex;gap:2.5mm;font-size:10.5pt;line-height:1.65;padding:4.5mm 0;border-top:.6pt solid var(--line)}
.v-a4 .tog p.it b{flex:none;font-weight:400;color:var(--pa);width:4mm}
.v-a4 .tog.d p.it b{color:var(--coral)}
.v-a4 .combine{background:#F3F8F5;border-radius:5mm;padding:6mm 7mm;text-align:center}
.v-a4 .combine small{font-size:9pt;color:var(--green-d);letter-spacing:.03em}
.v-a4 .combine .eq{display:flex;align-items:center;justify-content:center;gap:5mm;margin:4mm 0}
.v-a4 .combine .eq span{border-radius:999px;padding:2.4mm 6mm;font-family:var(--f-title);font-size:13pt;color:#fff}
.v-a4 .combine .eq .a{background:var(--pa)}
.v-a4 .combine .eq .b{background:var(--pb)}
.v-a4 .combine .eq strong{font-family:var(--f-title);font-weight:400;font-size:20pt;color:var(--ink2)}
.v-a4 .combine p{font-size:10.5pt;color:var(--ink2);line-height:1.65}
.v-a4 .quote{text-align:center;font-family:var(--f-title);font-size:15pt;line-height:1.6;color:var(--ink)}
.v-a4 .quote em{font-style:normal;color:var(--green)}
.v-a4 .final{display:flex;align-items:center;gap:8mm;background:var(--bg2);border-radius:5mm;padding:8mm 9mm}
.v-a4 .final .ringbox{width:62mm;flex:none}
.v-a4 .final .lead{font-size:11pt}
.v-a4 .final .lead b{font-family:var(--f-title);font-weight:400}
.v-a4 .rlist article{display:grid;grid-template-columns:5mm 36mm 1fr;align-items:center;gap:2mm;padding:6.5mm 0;border-bottom:.6pt solid var(--line)}
.v-a4 .rlist i{width:3.4mm;height:3.4mm;border-radius:50%}
.v-a4 .rlist small{font-family:var(--f-title);font-size:11pt}
.v-a4 .rlist p{font-size:10.5pt;color:var(--ink2)}
.v-a4 .fp-hd{flex:none;margin-bottom:4mm}
.v-a4 .fp-hd .en{font-size:9pt;color:var(--green);letter-spacing:.16em}
.v-a4 .fp-hd h1{font-size:21pt;margin-top:1mm}
.v-a4 .fp-hd p{font-size:9.5pt;color:var(--ink2);margin-top:1.5mm;line-height:1.6}
.v-a4 .fp-hd.sm h1{font-size:18pt}
.v-a4 .fp h2{font-size:12.5pt;margin:3.6mm 0 1.4mm;display:flex;align-items:center;gap:2.2mm}
.v-a4 .fp h2::before{content:"";width:1.3mm;height:4mm;border-radius:1mm;background:var(--green)}
.v-a4 .fp h3{font-size:10.5pt}
.v-a4 .fp p{font-size:9pt;color:var(--ink2);line-height:1.6}
.v-a4 .fp .muted{font-size:8pt;color:var(--sub);margin-top:1.5mm}
.v-a4 .cols{display:grid;gap:3.5mm}
.v-a4 .cols.two{grid-template-columns:1fr 1fr}
.v-a4 .cols.three{grid-template-columns:repeat(3,1fr)}
.v-a4 .cols.four{grid-template-columns:repeat(4,1fr)}
.v-a4 .fcard{background:var(--bg2);border-radius:3.5mm;padding:3.6mm 4.2mm}
.v-a4 .fcard .label{font-size:8pt;color:var(--sub)}
.v-a4 .fcard .score{font-family:var(--f-title);font-size:22pt;line-height:1.15;color:var(--ink)}
.v-a4 .fcard h3+p{margin-top:1mm}
.v-a4 .hero{grid-template-columns:1fr 1.35fr}
.v-a4 .hero .fcard{background:#fff;border:.75pt solid var(--line2);padding:4.4mm 5mm}
.v-a4 .hero .fit .row1{display:flex;align-items:baseline;gap:2.5mm}
.v-a4 .hero .fit .score{font-size:32pt;color:var(--green)}
.v-a4 .hero .fit .gr{font-family:var(--f-title);font-size:12pt;background:var(--green);color:#fff;border-radius:999px;padding:.4mm 3.2mm}
.v-a4 .hero .ty h3{font-size:16pt;margin:.6mm 0 1.4mm}
.v-a4 .hero .ty h3 em{font-style:normal;color:var(--green)}
.v-a4 .scale{margin-top:3mm}
.v-a4 .scale svg{display:block;width:100%;height:auto}
.v-a4 .fp-alert{display:flex;gap:3.5mm;border-radius:3.5mm;padding:2.8mm 4.5mm;margin-top:3mm;align-items:flex-start}
.v-a4 .fp-alert.caution{background:var(--warn-bg);color:#7A5600;border:.75pt solid #F1D9A6}
.v-a4 .fp-alert.risk{background:#FFF0EF;color:#B42318}
.v-a4 .fp-alert.ok{background:var(--safe-bg);color:#2F7D4F}
.v-a4 .fp-alert .ic{flex:none;width:6.5mm;height:6.5mm;border-radius:50%;background:var(--warn);color:#fff;display:grid;place-items:center;font-family:var(--f-title);font-size:11pt;margin-top:.4mm}
.v-a4 .fp-alert h3{font-size:11pt;color:#7A5600}
.v-a4 .fp-alert p{color:#7A5600;font-size:9pt;margin-top:.4mm}
.v-a4 .axis{background:#fff;border:.75pt solid var(--line2);border-top:1.4mm solid var(--green);padding:3.2mm 3.6mm}
.v-a4 .axis.off{border-top-color:#C5CAD3;background:var(--bg2)}
.v-a4 .axis.off .score{color:var(--sub)}
.v-a4 .axis h3{font-size:10pt}
.v-a4 .axis .score{font-size:21pt;color:var(--green)}
.v-a4 .axis .label{font-size:8pt;color:var(--sub);white-space:nowrap}
.v-a4 .meter{height:2.6mm;background:var(--bg3);border-radius:999px;position:relative;margin:2mm 0 2mm}
.v-a4 .meter span{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--green)}
.v-a4 .axis.off .meter span{background:#AEB4BF}
.v-a4 .meter s{position:absolute;left:65%;top:-1mm;bottom:-1mm;border-left:.9pt dashed var(--ink2)}
.v-a4 .axis p.m{font-size:8pt;line-height:1.5;min-height:9mm}
.v-a4 .axis .state{display:inline-block;margin-top:1.4mm;font-size:8pt;border-radius:999px;padding:.2mm 2.4mm;background:var(--safe-bg);color:var(--safe)}
.v-a4 .axis.off .state{background:var(--bg3);color:var(--sub)}
.v-a4 .callout{background:var(--green-l);border-radius:3.5mm;padding:3.2mm 4.5mm;color:var(--green-d)!important;font-size:9pt}
.v-a4 .callout.caution{background:var(--warn-bg);color:#7A5600!important}
.v-a4 .callout b{font-family:var(--f-title);font-weight:400}
.v-a4 .fp .lead{font-family:var(--f-title);font-size:12pt;color:var(--ink);margin-bottom:2mm}
.v-a4 .fp .lead em{font-style:normal;color:var(--green)}
.v-a4 .dcard{background:var(--ink);color:#fff;border-radius:3.5mm;padding:3.2mm 4.2mm}
.v-a4 .dcard .label{font-size:9pt;color:var(--mint)}
.v-a4 .dcard .score{font-family:var(--f-title);font-size:24pt;line-height:1.2}
.v-a4 .dcard p{color:#C9CED6!important;font-size:8.5pt}
.v-a4 .dcard .wb{height:1.8mm;background:rgba(255,255,255,.12);border-radius:999px;margin:1.6mm 0 2mm;position:relative}
.v-a4 .dcard .wb i{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--mint)}
.v-a4 .formula{background:var(--bg2);border-radius:3.5mm;padding:3mm 4.5mm;margin-top:3mm;font-size:9pt}
.v-a4 .formula b{font-family:var(--f-title);font-weight:400;color:var(--green)}
.v-a4 .ex .score{color:var(--green)}
.v-a4 .map{border:.75pt solid var(--line2);border-radius:3.5mm;overflow:hidden;margin-top:2mm}
.v-a4 .map-row{display:grid;grid-template-columns:24mm 30mm 1fr;gap:3mm;padding:1.05mm 4mm;border-top:.6pt solid var(--line);font-size:8.8pt;align-items:center}
.v-a4 .map-row:first-child{border-top:0}
.v-a4 .map-row.head{background:var(--bg2);color:var(--sub);font-size:8pt}
.v-a4 .map-row span:first-child{font-family:var(--f-title)}
.v-a4 .map-row.head span:first-child{font-family:var(--f-body)}
.v-a4 .map-row.current{background:var(--green-l);box-shadow:inset 1.4mm 0 0 var(--green)}
.v-a4 .map-row.current span:last-child::after{content:"나의 유형";margin-left:2mm;font-size:7.5pt;background:var(--green);color:#fff;border-radius:999px;padding:.2mm 2mm}
.v-a4 .map.grade .map-row{grid-template-columns:28mm 24mm 1fr}
.v-a4 .types{grid-template-columns:1fr 1fr;gap:3.6mm;flex:1;min-height:0}
.v-a4 .tcard{border:.75pt solid var(--line2);border-radius:3.5mm;padding:3.6mm 4.4mm}
.v-a4 .tcard h3{font-size:11pt;display:flex;align-items:center;gap:2mm}
.v-a4 .tcard h3 .c{font-family:var(--f-title);font-size:10pt;background:var(--green-l);color:var(--green);border-radius:1.6mm;padding:.2mm 2mm}
.v-a4 .tcard .lead{font-family:var(--f-body)!important;font-size:9.2pt!important;color:var(--ink)!important;margin:1.4mm 0 1.4mm!important;line-height:1.5}
.v-a4 .tcard p:not(.lead){font-size:8.5pt;line-height:1.5;display:grid;grid-template-columns:7.5mm 1fr;margin-top:1.2mm}
.v-a4 .tcard p b{font-weight:400;color:var(--green)}
.v-a4 .tcard.mine{border:.9mm solid var(--green);background:#F5FBF8}
.v-a4 .tcard .mylabel{display:inline-block;font-size:8pt;background:var(--green);color:#fff;border-radius:999px;padding:.2mm 2.6mm;margin-top:1.2mm}
.v-a4 .uses .fcard h3{color:var(--green)}
.v-a4 .fp h3.sh{font-size:10.5pt;margin:3mm 0 .6mm;color:var(--ink)}

/* ---------- SPA 추가분 ---------- */
.v-a4{flex:1;min-height:100vh}
.v-a4 .a4-toolbar .btns{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.v-a4 .a4-toolbar .hint{font-size:12px;color:#AEB4BF;white-space:nowrap}
.v-a4 .a4-toolbar .t{min-width:0}
.v-a4 .a4-toolbar .t span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media screen{.v-a4 .a4-stack{zoom:var(--a4z,1)}}
@media screen and (max-width:900px){
  .v-a4 .a4-toolbar{flex-direction:column;align-items:stretch;padding:10px 16px}
  .v-a4 .a4-toolbar .t{flex-wrap:wrap;row-gap:2px}
  .v-a4 .a4-toolbar .btns .btn{padding:7px 12px}
  .v-a4 .a4-stack{padding:16px 0 40px;gap:16px}
}
@media print{.v-a4{min-height:0}}
.v-a4 .na small,.v-a4 .na-note{font-family:var(--f-body)}
.v-a4 .na-note{display:block;font-size:7.5pt;color:var(--sub);margin-top:.6mm;line-height:1.4}
.v-a4 .a4.dark .na-note{color:rgba(255,255,255,.7)}
/* 긴 이름·유형명 대비 */
.v-a4 .mcard .ln .who,.v-a4 .brow.hd .who{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}
.v-a4 .mcard .ln .who i,.v-a4 .brow.hd .who i{margin-right:1.6mm;vertical-align:.1mm}
.v-a4 .pcard .who-l>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v-a4 .combine .eq{flex-wrap:wrap}
.v-a4 .cv-name,.v-a4 .cv-pair{overflow-wrap:anywhere}
.v-a4 .cv-chips span{max-width:100%;width:auto;align-self:flex-start}
.v-a4 .insight .b{overflow-wrap:anywhere}
.v-a4 .tgrid .tl.you .none{color:#fff}
/* FP 경고 색 (보완 필요 / 위험 / 정상) */
.v-a4 .fp-alert.risk{border:.75pt solid #F5C2BE}
.v-a4 .fp-alert.risk .ic{background:#D92D20}
.v-a4 .fp-alert.risk h3,.v-a4 .fp-alert.risk p{color:#B42318}
.v-a4 .fp-alert.ok{border:.75pt solid #BFE3CD}
.v-a4 .fp-alert.ok .ic{background:var(--safe)}
.v-a4 .fp-alert.ok h3,.v-a4 .fp-alert.ok p{color:#2F7D4F}

/* ===== 1·2차 수정 (피그마 반영) ===== */
#app .tiles{gap:2px 10px}
#app .tile{background:transparent!important;box-shadow:none!important;transform:none!important;border-radius:0!important;aspect-ratio:1.7/1}
#app .tile.t1{color:rgba(47,125,82,.34)}
#app .tile.t2{color:rgba(46,111,142,.34)}
#app .tile.t3{color:rgba(143,100,6,.34)}
#app .tile.t4{color:rgba(184,67,31,.34)}
#app .tile .no{opacity:1}
#app .tile:hover{color:var(--ink2)}
#app .tile.you{color:var(--green)!important}
#app .tile.you::after{content:"";position:absolute;left:50%;bottom:14%;width:34px;height:3px;border-radius:2px;background:var(--green);transform:translateX(-50%)}
#app .letters div{background:transparent!important;border-radius:0;border-bottom:1px solid var(--line);padding:10px 4px}
#app .letters div.off{opacity:.35}
#app .tgrid{gap:0 3mm}
#app .tgrid .tl{background:transparent!important;box-shadow:none!important;height:21mm;border-radius:0}
#app .tgrid .t1{color:rgba(43,122,80,.34)}
#app .tgrid .t2{color:rgba(46,111,142,.34)}
#app .tgrid .t3{color:rgba(154,107,8,.34)}
#app .tgrid .t4{color:rgba(181,67,42,.34)}
#app .tgrid .tl .r{opacity:1}
#app .tgrid .you{color:var(--green)!important}
#app .tgrid .you::after{content:"";position:absolute;left:50%;bottom:3.2mm;width:9mm;height:.9mm;border-radius:1mm;background:var(--green);transform:translateX(-50%)}
#app .a4 .letters span{background:transparent!important;border-radius:0;border-bottom:.6pt solid var(--line);padding:2.2mm 1mm}
#app .a4 .letters span.off{opacity:.35}
#app .dcard{background:transparent!important;color:var(--ink);border-radius:0;padding:1mm 0 1mm 4.5mm;border-left:.75pt solid var(--line2)}
#app .cols.four .dcard:first-child{border-left:none;padding-left:0}
#app .dcard .label{color:var(--ink)!important;font-family:var(--f-body)}
#app .dcard .score{color:var(--green)}
#app .dcard p{color:var(--sub)!important}
#app .dcard .wb{background:var(--line)!important;height:1.2mm}
#app .dcard .wb i{background:var(--green)!important}
#app .formula{background:transparent!important;border-radius:0;padding:2.6mm 0;border-top:.6pt solid var(--line);border-bottom:.6pt solid var(--line)}
#app .a4 p,#app .a4 li,#app .a4 h1,#app .a4 h2,#app .a4 h3,#app .dcard p{word-break:keep-all}
#app .a4-hd .en{margin-bottom:1.6mm;line-height:1.2}
#app .fp-hd .en{margin-bottom:1.4mm;line-height:1.2}
#app .fp-hd h1{margin-top:0}
#app .type-ban{background:none!important;color:var(--ink);padding:1mm 0 0;border-radius:0}
#app .type-ban .c{color:var(--green)}
#app .type-ban .t{color:var(--ink)}
#app .op-ic{display:block;flex:none}
#app .grade-list .op-ic{width:2.6mm!important;height:2.6mm!important}
#app .bl .c .op-ic{width:13px!important;height:13px!important}
#app .rt:has(.side-dot) th:nth-child(2),#app .rt td:nth-child(2):has(.side-dot){text-align:left;padding-left:7mm}
#app .fate,#app .inkbox{background:transparent!important;color:var(--ink)!important;border-radius:0!important;border-top:1pt solid var(--ink);border-bottom:.6pt solid var(--line2);padding-left:0;padding-right:0}
#app .fate .b,#app .inkbox small{color:var(--green)!important}
#app .inkbox .roles p span{color:var(--sub)!important}
#app .inkbox .roles>b{color:var(--green)!important}
#app .inkbox hr{border-top-color:var(--line)!important}
#app .inkbox *{color:inherit}
#app .rs-hero,#app .mc-cover{border-radius:0!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding-left:calc(50vw - 50% + 48px)!important;padding-right:calc(50vw - 50% + 48px)!important}
#app .a4 .banner{border-radius:0!important;margin-left:-16mm;margin-right:-16mm;padding-left:16mm;padding-right:16mm}
/* 사장님 피그마 4페이지 */
body.L-site2{background:#fff}
.s2-host{display:block}
body.L-site2x .s2-body{min-height:50vh}