.profile-hero { padding:56px 0; background:linear-gradient(135deg,#0d7ec0 0%,#168fd4 50%,#1ba0e8 100%); color:#fff; border-radius:12px; text-align:center; }
#profile-section { padding-top:16px !important; padding-bottom:0 !important; }
.profile-hero h1 { margin:0 0 8px; font-size:32px; font-weight:700; letter-spacing:-.5px; }
.profile-hero p { max-width:560px; margin:0 auto; color:rgba(255,255,255,.8); font-size:14px; line-height:1.5; }

.profile-layout { display:grid; grid-template-columns:230px 1fr; gap:24px; margin-top:16px; }

.profile-nav {
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:20px 0; position:sticky; top:80px; align-self:start;
  box-shadow:var(--shadow-sm); overflow:hidden;
}
.profile-nav-header { display:flex; align-items:center; gap:12px; padding:0 20px 16px; border-bottom:1px solid var(--line); margin-bottom:12px; }
.profile-avatar {
  width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--gold),var(--teal));
  color:#fff; display:grid; place-items:center; font-size:18px; font-weight:700; flex-shrink:0;
}
.profile-nav-user { display:flex; flex-direction:column; min-width:0; }
.profile-nav-user b { color:var(--ink); font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.profile-nav-user span { color:var(--muted); font-size:12px; }

.profile-nav-menu { display:flex; flex-direction:column; gap:2px; padding:0 8px; }
.profile-nav-item {
  display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius:8px;
  color:var(--muted); font-size:14px; font-weight:500; text-decoration:none; transition:all .2s var(--ease);
  position:relative; cursor:pointer;
}
.profile-nav-item svg { width:20px; height:20px; flex-shrink:0; opacity:.8; }
.profile-nav-item:hover { color:var(--ink); background:var(--paper); }
.profile-nav-item.active { color:var(--gold); background:var(--gold-light); font-weight:600; }
.profile-nav-item.active::before {
  content:''; position:absolute; left:-8px; top:50%; transform:translateY(-50%);
  width:3px; height:22px; background:var(--gold); border-radius:0 3px 3px 0;
}
.profile-nav-item.active svg { opacity:1; }
.profile-nav-divider { height:1px; background:var(--line); margin:8px 12px; }

.profile-content { display:flex; flex-direction:column; gap:24px; min-width:0; }
.profile-panel { display:none; flex-direction:column; gap:24px; }
.profile-panel.active { display:flex; }

.profile-card {
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:24px; box-shadow:var(--shadow-sm);
}
.profile-card .card-head { margin-bottom:20px; }
.profile-card .card-head h3 { margin:6px 0 0; font-size:20px; font-weight:600; }

.user-info { display:flex; flex-direction:column; gap:14px; margin-bottom:20px; }
.info-row { display:flex; justify-content:space-between; align-items:center; font-size:14px; }
.info-row span { color:var(--muted); }
.info-row b { color:var(--ink); font-weight:500; text-align:right; max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.profile-card .button { margin-top:8px; }

.overview-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.ov-stat { text-align:center; padding:20px 12px; background:var(--paper); border:1px solid var(--line); border-radius:8px; }
.ov-value { font-size:28px; font-weight:700; color:var(--gold); }
.ov-label { margin-top:6px; font-size:12px; color:var(--muted); }

.security-list { display:flex; flex-direction:column; gap:16px; }
.security-item { display:flex; justify-content:space-between; align-items:center; padding:16px; border:1px solid var(--line); border-radius:8px; }
.sec-info { display:flex; flex-direction:column; gap:4px; }
.sec-info b { font-size:15px; font-weight:600; color:var(--ink); }
.sec-info span { font-size:13px; color:var(--muted); }
.sec-value { font-size:14px; font-weight:500; color:var(--teal); }

.empty-state { display:flex; flex-direction:column; align-items:center; gap:12px; padding:40px 20px; text-align:center; color:var(--muted); }
.empty-state.compact { padding:20px; }
.empty-mark { width:48px; height:48px; display:grid; place-items:center; font-size:28px; color:var(--gold); border:2px dashed var(--line); border-radius:50%; }
.empty-state p { margin:0; font-size:14px; }

.strategy-mini-list { display:flex; flex-direction:column; gap:10px; }
.strategy-mini-item { display:flex; align-items:center; gap:8px; padding:12px 14px; border:1px solid var(--line); border-radius:8px; transition:all .2s; }
.strategy-mini-item:hover { border-color:var(--gold); background:#f0f7ff; }
.strategy-mini-link { flex:1; min-width:0; text-decoration:none; color:var(--ink); }
.strategy-mini-info { min-width:0; }
.strategy-mini-info h4 { margin:0 0 4px; font-size:15px; font-weight:600; }
.strategy-mini-info span { font-size:12px; color:var(--muted); }
.strategy-mini-cancel { background:none; border:1px solid #e74c3c; color:#e74c3c; font-size:13px; padding:5px 12px; border-radius:6px; cursor:pointer; white-space:nowrap; transition:all .2s; }
.strategy-mini-cancel:hover { background:#e74c3c; color:#fff; }
.referral-vip0-notice { text-align:center; padding:30px 20px; color:var(--muted); display:flex; flex-direction:column; align-items:center; gap:14px; }
.referral-vip0-notice p { margin:0; font-size:15px; }

.membership-current { background:linear-gradient(135deg,#e8f4ff,#d1ecff); border:1px solid #7dd3fc; border-radius:10px; padding:16px 20px; margin-bottom:20px; display:flex; align-items:center; gap:16px; }
.membership-current .mc-badge { font-size:28px; font-weight:800; color:#fff; width:56px; height:56px; border-radius:50%; display:grid; place-items:center; flex-shrink:0; }
.membership-current .mc-info h4 { margin:0 0 4px; font-size:18px; font-weight:600; }
.membership-current .mc-info p { margin:0; font-size:13px; color:var(--muted); }
.membership-levels { display:flex; flex-direction:column; gap:12px; }

.downloads-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
.downloads-col { padding:20px; display:flex; flex-direction:column; }
.downloads-col .card-head { margin-bottom:16px; }
.downloads-col .license-table, .downloads-col .order-table { flex:1; overflow-y:auto; }
.pagination-bar { margin-top:auto; padding-top:16px; }

.pagination-bar { display:flex; justify-content:center; align-items:center; gap:8px; margin-top:16px; flex-wrap:wrap; }
.pagination-bar:empty { display:none; }
.pagination-bar .pg-btn { min-width:36px; height:36px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:14px; cursor:pointer; display:grid; place-items:center; transition:all .2s; }
.pagination-bar .pg-btn:hover:not(:disabled) { border-color:var(--gold); color:var(--gold); }
.pagination-bar .pg-btn.active { background:var(--gold); color:#fff; border-color:var(--gold); }
.pagination-bar .pg-btn:disabled { opacity:.4; cursor:default; }
.pagination-bar .pg-info { font-size:13px; color:var(--muted); margin:0 4px; }
.membership-level-card { display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--line); border-radius:10px; transition:all .2s; }
.membership-level-card:hover { border-color:var(--gold); box-shadow:0 2px 8px rgba(21,153,229,.12); }
.membership-level-card.current { border-color:var(--gold); background:#f0f7ff; box-shadow:0 2px 8px rgba(21,153,229,.15); }
.ml-badge { font-size:18px; font-weight:800; color:#fff; width:48px; height:48px; border-radius:50%; display:grid; place-items:center; flex-shrink:0; }
.ml-badge-v0 { background:#aaa; }
.ml-badge-v1 { background:#4caf50; }
.ml-badge-v2 { background:#2196f3; }
.ml-badge-v6 { background:#9c27b0; }
.ml-badge-v8 { background:linear-gradient(135deg,#ff6b00,#ff9500); }
.ml-info { flex:1; }
.ml-info .ml-name { font-size:16px; font-weight:600; }
.ml-info .ml-price { font-size:15px; color:var(--gold); font-weight:700; margin-top:2px; }
.ml-desc { font-size:13px; color:var(--muted); text-align:right; white-space:nowrap; }

.license-table { display:flex; flex-direction:column; gap:8px; }
.license-row {
  display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center;
  padding:10px 14px; border:1px solid var(--line); border-radius:8px; transition:all .25s var(--ease); font-size:13px;
}
.license-row:hover { border-color:var(--gold); box-shadow:var(--shadow-sm); }
.license-row.expired { opacity:.65; }
.license-row.suspended { background:#fff5f5; }
.license-detail { display:flex; flex-direction:column; gap:2px; min-width:0; }
.license-detail .lic-name { font-weight:600; font-size:14px; }
.lic-type-badge { display:inline-block; font-size:11px; font-weight:700; padding:2px 7px; border-radius:4px; margin-right:8px; vertical-align:middle; }
.lic-type-badge.ea { background:#e8f4ff; color:#1599e5; border:1px solid #7dd3fc; }
.lic-type-badge.ind { background:#fef3c7; color:#d97706; border:1px solid #fcd34d; }
.lic-section-header { display:flex; align-items:center; gap:8px; padding:8px 0 4px; margin-top:6px; border-bottom:2px solid #1599e5; }
.lic-section-header:first-child { margin-top:0; }
.lic-section-icon { font-size:16px; }
.lic-section-title { font-size:14px; font-weight:700; color:#087f9d; }
.lic-section-count { margin-left:auto; font-size:11px; color:var(--muted); }
.license-detail .lic-meta { font-size:12px; color:var(--muted); display:flex; flex-wrap:wrap; gap:6px; }
.license-detail .lic-key { font:11px var(--mono); color:var(--teal); word-break:break-all; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.license-detail .lic-key code { font:inherit; color:inherit; word-break:break-all; }
.lic-key-label { font-size:12px; color:var(--muted); white-space:nowrap; font-family:var(--sans); }
.copy-key-btn { padding:4px 10px; border:1px solid var(--line); border-radius:4px; background:var(--card); color:var(--muted); font-size:12px; cursor:pointer; white-space:nowrap; transition:all .2s; }
.copy-key-btn:hover { border-color:var(--gold); color:var(--gold); }
.license-actions { display:flex; flex-direction:row; align-items:center; gap:6px; }
.license-actions .button { min-height:auto; padding:4px 12px; font-size:12px; }
.license-status-badge { display:inline-flex; align-items:center; gap:4px; padding:3px 10px; border-radius:12px; font-size:12px; font-weight:600; }
.license-status-badge.active { background:#e0f7ed; color:#1a8a5a; }
.license-status-badge.expired { background:#fef0f0; color:var(--red); }
.license-status-badge.suspended { background:#fff5f5; color:var(--red); }

.order-table { display:flex; flex-direction:column; gap:8px; }
.order-row {
  display:grid; grid-template-columns:1fr auto auto; gap:12px; align-items:center;
  padding:10px 14px; border:1px solid var(--line); border-radius:8px; font-size:13px;
}
.order-row .ord-info { display:flex; flex-direction:column; gap:2px; min-width:0; }
.order-row .ord-info b { font-weight:600; font-size:14px; }
.order-row .ord-info span { font-size:12px; color:var(--muted); }
.order-row .ord-amount { font-weight:600; color:var(--ink); font-size:13px; }
.order-row .ord-status { font-size:11px; font-weight:600; padding:3px 10px; border-radius:12px; text-align:center; }
.order-row .ord-status.paid { background:#e0f7ed; color:#1a8a5a; }
.order-row .ord-status.pending { background:#fff4e0; color:#b8860b; }

.referral-panel { display:flex; flex-direction:column; gap:24px; }
.referral-share { display:grid; grid-template-columns:220px 1fr; gap:32px; align-items:start; }
.qr-section { display:flex; flex-direction:column; gap:12px; align-items:center; }
.qr-box { width:220px; height:220px; display:flex; align-items:center; justify-content:center; background:#fff; border:2px solid var(--line); border-radius:12px; overflow:hidden; flex-shrink:0; }
.qr-box svg, .qr-box img { width:100%; height:100%; display:block; object-fit:contain; }
.qr-placeholder { color:var(--muted); font-size:14px; }
.share-info { display:flex; flex-direction:column; gap:10px; }
.share-info label { font-size:13px; color:var(--muted); font-weight:500; }
.share-info .code-field { display:flex; gap:8px; }
.share-info .code-field input { flex:1; padding:8px 12px; border:1px solid var(--line); border-radius:6px; font:13px var(--mono); color:var(--ink); background:var(--paper); }
.share-info .code-field button { padding:8px 16px; border:1px solid var(--gold); background:transparent; color:var(--gold); border-radius:6px; font-size:13px; font-weight:600; transition:all .25s var(--ease); }
.share-info .code-field button:hover { background:var(--gold); color:#fff; }
.share-hint { margin:4px 0 0; font-size:13px; color:var(--muted); line-height:1.5; }

.referral-stats { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.ref-stat { text-align:center; padding:20px 12px; background:var(--paper); border:1px solid var(--line); border-radius:8px; }
.ref-value { font-size:28px; font-weight:700; color:var(--gold); }
.ref-label { margin-top:6px; font-size:12px; color:var(--muted); }

.tier-info { padding:14px 18px; background:linear-gradient(135deg,#e5f6ff 0%,#f0faff 100%); border:1px solid var(--gold-light); border-radius:8px; font-size:14px; color:var(--teal); }
.tier-info strong { color:var(--gold); }

.tier-table { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.tier-table table { width:100%; border-collapse:collapse; font-size:14px; }
.tier-table th, .tier-table td { padding:10px 16px; text-align:left; border-bottom:1px solid var(--line); }
.tier-table th { background:var(--paper); font-weight:600; color:var(--muted); font-size:13px; }
.tier-table td { color:var(--ink); }
.tier-table tr:last-child td { border-bottom:0; }

.commission-section h4 { margin:0 0 12px; font-size:16px; font-weight:600; }
.commission-table { display:flex; flex-direction:column; gap:8px; }

.referred-section h4 { margin:0 0 12px; font-size:16px; font-weight:600; }
.referred-table { display:flex; flex-direction:column; gap:8px; }
.referred-row {
  display:grid; grid-template-columns:1fr auto auto; gap:16px; align-items:center;
  padding:12px 16px; border:1px solid var(--line); border-radius:8px; font-size:14px;
}
.referred-row .ref-name { font-weight:500; }
.referred-row .ref-date { font-size:12px; color:var(--muted); }
.referred-row .ref-status { font-size:12px; font-weight:600; padding:3px 10px; border-radius:12px; text-align:center; }
.referred-row .ref-status.purchased { background:#e0f7ed; color:#1a8a5a; }
.referred-row .ref-status.registered { background:#e5f6ff; color:var(--teal); }
.commission-row {
  display:grid; grid-template-columns:1fr auto auto auto; gap:16px; align-items:center;
  padding:12px 16px; border:1px solid var(--line); border-radius:8px; font-size:14px;
}
.commission-row .com-user { font-weight:500; }
.commission-row .com-amount { font:13px var(--mono); color:var(--muted); }
.commission-row .com-rate { font:13px var(--mono); color:var(--teal); }
.commission-row .com-status { font-size:12px; font-weight:600; padding:3px 10px; border-radius:12px; text-align:center; }
.commission-row .com-status.settled { background:#e0f7ed; color:#1a8a5a; }
.commission-row .com-status.pending { background:#fff4e0; color:#b8860b; }

.settlement-section h4 { margin:0 0 12px; font-size:16px; font-weight:600; }
.settlement-row { padding:12px 16px; border:1px solid var(--line); border-radius:8px; font-size:14px; display:flex; justify-content:space-between; align-items:center; }
.settlement-row .set-period { font-weight:600; }
.settlement-row .set-amount { color:var(--gold); font-weight:600; }

@media (max-width:900px) {
  .profile-layout { grid-template-columns:1fr; }
  .profile-nav { position:static; }
  .profile-nav-menu { flex-direction:row; flex-wrap:wrap; gap:4px; }
  .profile-nav-item { flex:1 1 auto; }
  .profile-nav-divider { display:none; }
  .downloads-grid { grid-template-columns:1fr; }
  .referral-share { grid-template-columns:1fr; justify-items:center; gap:20px; }
  .qr-box { margin:0 auto; }
  .referral-stats { grid-template-columns:repeat(2,1fr); }
  .overview-stats { grid-template-columns:repeat(2,1fr); }
  .commission-row { grid-template-columns:1fr auto; }
  .commission-row .com-amount, .commission-row .com-rate { grid-column:span 1; }
}
@media (max-width:760px) {
  .license-actions .button { min-height:44px; padding:10px 18px; font-size:14px; }
  .copy-key-btn { padding:8px 14px; font-size:13px; min-height:36px; }
  .strategy-mini-cancel { padding:10px 16px; font-size:13px; min-height:36px; }
  .profile-nav-item { padding:10px 12px; font-size:13px; }
  .order-row { grid-template-columns:1fr; gap:6px; padding:14px; }
  .order-row .ord-amount, .order-row .ord-status { text-align:left; }
  .referred-row { grid-template-columns:1fr; gap:6px; padding:14px; }
  .commission-row { grid-template-columns:1fr; gap:6px; padding:14px; }
  .qr-box { width:180px; height:180px; }
  .tier-info { padding:12px 14px; font-size:13px; }
  .profile-section { padding:16px; }
  .overview-stats { grid-template-columns:1fr; }
  .referral-stats { grid-template-columns:1fr; }
}
