/* ===== v3 전용 컴포넌트 ===== */
.topnav{margin-left:auto;display:flex;gap:6px;align-items:center}
.topnav a{font-size:14px;font-weight:800;color:var(--muted);text-decoration:none;padding:7px 11px;border:2px solid transparent;border-radius:10px}
.topnav a:hover{color:var(--black);border-color:var(--black);box-shadow:var(--shadow-hard-sm)}
.topnav a.uses-nav{background:var(--yellow);color:var(--black);border-color:var(--black);box-shadow:var(--shadow-hard-sm)}
.uses-chip{display:inline-block;background:var(--yellow);border:2.5px solid var(--black);border-radius:999px;
  box-shadow:var(--shadow-hard-sm);padding:8px 18px;font-weight:800;font-size:15px;color:var(--black);font-family:'CookieRun',sans-serif}

.google-btn{background:#fff;border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard);
  padding:15px 24px;font-size:17px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:12px;
  width:100%;max-width:360px;margin:0 auto;cursor:pointer;text-decoration:none;color:var(--black);
  font-family:'CookieRun','Apple SD Gothic Neo',sans-serif}
.google-btn:hover{background:var(--gray-bg);transform:translate(-2px,-2px);box-shadow:var(--shadow-hard-lg)}
.google-btn .gicon{width:22px;height:22px;flex:none}
.kakao-login-btn{background:#FEE500;border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard);
  padding:15px 24px;font-size:17px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;max-width:360px;margin:12px auto 0;cursor:pointer;text-decoration:none;color:#3C1E1E;
  font-family:'CookieRun','Apple SD Gothic Neo',sans-serif}
.kakao-login-btn:hover{background:#f5dc00;transform:translate(-2px,-2px);box-shadow:var(--shadow-hard-lg)}
.kakao-login-btn .kakao-ico{width:21px;height:21px;flex:none}
.link-sub{display:block;text-align:center;margin:18px auto 0;font-size:15px;font-weight:700;color:var(--blue);text-decoration:underline;cursor:pointer;max-width:360px}

/* 시험 메뉴 (문제지/정답/해설/분석) */
.exam-menu{max-width:440px;margin:8px auto 0;display:flex;flex-direction:column;gap:12px}
.menu-btn{display:flex;align-items:center;gap:14px;background:#fff;border:2.5px solid var(--black);
  border-radius:16px;box-shadow:var(--shadow-hard);padding:15px 18px;text-decoration:none;color:var(--black);text-align:left}
.menu-btn:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-hard-lg)}
.menu-btn.primary{background:var(--yellow)}
.menu-btn.primary:hover{background:var(--yellow-dark)}
.menu-btn.disabled{opacity:.5;box-shadow:var(--shadow-hard-sm);cursor:not-allowed;pointer-events:none}
.menu-btn .mb-ico{font-size:28px;flex:none;width:38px;text-align:center}
.menu-btn .mb-txt{flex:1;display:flex;flex-direction:column;line-height:1.3;min-width:0}
.menu-btn .mb-txt b{font-size:19px;font-weight:900;font-family:'CookieRun',sans-serif}
.menu-btn .mb-txt small{font-size:13px;color:var(--muted);font-weight:600}
.menu-btn .mb-arrow{font-size:22px;font-weight:900;color:var(--muted);flex:none}
.menu-btn.primary .mb-arrow{color:var(--black)}
.menu-note{max-width:440px;margin:16px auto 0;text-align:center;font-size:13px;color:var(--muted);font-weight:600}

/* 코드 인증 */
.verify-wrap{max-width:440px;margin:10px auto;text-align:center}
.verify-wrap h2{font-size:24px;margin-bottom:6px}
.verify-wrap .desc{color:var(--muted);font-weight:600;font-size:16px;margin-bottom:22px}
.code-input{width:100%;height:58px;border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard);
  font-size:20px;font-weight:800;text-align:center;letter-spacing:1px;font-family:'CookieRun',sans-serif;text-transform:uppercase}
.err-msg{color:var(--red);font-weight:800;font-size:14px;margin-top:10px}
.payment-box{border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard-sm);background:#fff;padding:18px;margin-top:24px;text-align:left}
.payment-box h3{font-size:17px;margin-bottom:10px}
.payment-box ol{margin:0 0 14px 18px;font-size:14px;line-height:1.9;color:#333}
.price-box{display:flex;gap:10px;margin-bottom:14px}
.price-box div{flex:1;border:2px solid var(--black);border-radius:12px;padding:10px;text-align:center;font-weight:800;font-size:14px}
.kakao-btn{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--yellow);border:2.5px solid var(--black);
  border-radius:14px;box-shadow:var(--shadow-hard-sm);padding:13px;font-weight:900;font-size:16px;text-decoration:none;color:var(--black);
  font-family:'CookieRun',sans-serif}
.payment-box .small{font-size:12px;color:var(--muted);margin-top:10px;text-align:center}

/* 내 기록 */
.hist-card{border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard-sm);background:#fff;padding:16px 18px;margin-bottom:12px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hist-card .hc-main{flex:1;min-width:160px}
.hist-card .hc-title{font-weight:900;font-size:16px}
.hist-card .hc-meta{font-size:13px;color:var(--muted);font-weight:600;margin-top:3px}
.hist-card .hc-score{font-weight:900;font-size:20px;font-family:'CookieRun',sans-serif}
.hist-card .hc-grade{font-weight:900;font-size:14px;color:#fff;padding:4px 10px;border-radius:10px;border:2px solid var(--black)}
.g1{background:var(--blue)}.g2{background:var(--green)}.g3{background:var(--green);opacity:.85}
.g45{background:var(--orange)}.g68{background:var(--red)}.gnone{background:#bbb}
.hc-btn{background:var(--yellow);border:2.5px solid var(--black);border-radius:12px;box-shadow:var(--shadow-hard-sm);
  padding:9px 16px;font-weight:800;font-size:14px;text-decoration:none;color:var(--black);font-family:'CookieRun',sans-serif}

/* 관리자 */
.admin-form{border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard-sm);background:#fff;padding:18px;margin-bottom:20px;display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.admin-form .fcol{flex:1;min-width:140px}
.admin-form label{display:block;font-weight:800;font-size:13px;margin-bottom:6px}
.admin-form input,.admin-form select{width:100%;height:46px;border:2.5px solid var(--black);border-radius:12px;padding:0 12px;font-size:15px;font-weight:700}
.admin-table{width:100%;border-collapse:collapse;font-size:13px}
.admin-table th,.admin-table td{border:1.5px solid var(--border);padding:8px 10px;text-align:left}
.admin-table th{background:var(--gray-bg);font-weight:800}
.badge-used{color:var(--red);font-weight:800}.badge-free{color:var(--green);font-weight:800}
/* 대시보드 통계 카드 */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}
.stat-card{border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard-sm);background:#fff;padding:20px}
.stat-label{font-weight:800;font-size:14px;color:var(--muted)}
.stat-num{font-family:'CookieRun',sans-serif;font-weight:900;font-size:38px;color:var(--black);margin-top:6px}
.mini-stats{margin:12px 2px 20px;font-size:14px;color:var(--muted);font-weight:700;line-height:1.9}
.mini-stats b{color:var(--black)}
.dash-card{border:2.5px solid var(--black);border-radius:16px;box-shadow:var(--shadow-hard-sm);background:#fff;padding:18px;margin-bottom:16px}
.dash-head{font-weight:900;font-size:16px;margin-bottom:14px;font-family:'CookieRun',sans-serif}
.trend{display:flex;align-items:flex-end;gap:4px;height:130px}
.trend-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%}
.trend-bar{width:100%;background:var(--yellow);border:2px solid var(--black);border-radius:5px 5px 0 0;min-height:2px;margin-top:auto;position:relative;display:flex;justify-content:center}
.trend-bar span{position:absolute;top:-16px;font-size:11px;font-weight:800}
.trend-x{font-size:9px;color:var(--muted);margin-top:4px;font-weight:700;white-space:nowrap}
.dist-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.dist-label{width:180px;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dist-bar-wrap{flex:1;background:var(--gray-bg);border-radius:6px;height:16px;overflow:hidden}
.dist-bar{height:100%;background:var(--blue);border-radius:6px;min-width:2px}
.dist-count{width:30px;text-align:right;font-weight:800;font-size:13px}
/* 동의 페이지 */
.consent-form{text-align:left;max-width:400px;margin:24px auto 0}
.consent-all{display:flex;align-items:center;gap:10px;padding:14px;border:2.5px solid var(--black);border-radius:14px;
  box-shadow:var(--shadow-hard-sm);font-weight:900;font-size:16px;cursor:pointer;margin-bottom:10px}
.consent-item{padding:8px 14px}
.consent-item label{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;cursor:pointer}
.consent-form input[type=checkbox]{width:20px;height:20px;flex:none;accent-color:var(--blue)}
.consent-item a{color:var(--blue);text-decoration:underline}
/* 정책 페이지 */
.policy{max-width:640px;margin:0 auto;text-align:left;line-height:1.7}
.policy h2{margin-bottom:10px}
.policy h3{font-size:16px;margin:20px 0 6px}
.policy p{font-size:14px;color:#333;margin-bottom:6px}
.policy-draft{background:var(--red-light);border:2px solid var(--red);border-radius:10px;padding:10px 14px;font-size:13px;font-weight:800;color:var(--red);margin-bottom:18px}
.policy-date{font-size:12px;color:var(--muted);margin-top:20px}
.policy .back-link{margin-top:16px}
/* 푸터 */
.site-footer{max-width:760px;margin:30px auto 0;padding:18px;text-align:center;border-top:2px solid var(--border);
  font-size:13px;color:var(--muted);font-weight:700}
.site-footer a{color:var(--muted);text-decoration:none;margin:0 8px}
.site-footer a:hover{color:var(--black);text-decoration:underline}

/* 저장 알림 배너 */
.save-banner{background:var(--green-light);border:2.5px solid var(--green);border-radius:14px;box-shadow:var(--shadow-hard-sm);
  padding:12px 16px;margin-bottom:16px;font-weight:800;color:var(--green);font-size:14px;display:flex;align-items:center;gap:8px}
