:root{color-scheme:dark;--bg:#0b111b;--surface:#121d2d;--raised:#19273a;--ink:#eef3fb;--muted:#a5b4c8;--line:#293a50;--accent:#d7ef87;--accent-ink:#1a2605;--danger:#ffaaa4;--shadow:0 18px 50px #0002}
:root[data-theme=light]{color-scheme:light;--bg:#f3f6fb;--surface:#fff;--raised:#eaf0f7;--ink:#172337;--muted:#51627b;--line:#d6dfeb;--accent:#365b13;--accent-ink:#fff;--danger:#b12c28;--shadow:0 16px 45px #2035550a}
*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}button,a,select{touch-action:manipulation}button,a{transition:background .15s,color .15s}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.skip{position:absolute;left:20px;top:-100px}.skip:focus{top:10px;z-index:10;background:var(--surface);padding:12px}.layout{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}.sidebar{padding:30px 20px;border-right:1px solid var(--line);background:var(--surface);position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.brand{font-size:18px;font-weight:850;letter-spacing:-.5px;display:block}.brand span{color:var(--accent)}.brand small{display:block;font-size:12px;font-weight:500;color:var(--muted);letter-spacing:2px;margin-top:5px}.nav{display:grid;gap:7px;margin-top:44px}.nav button{border:0;background:transparent;color:var(--muted);padding:13px 14px;border-radius:10px;text-align:left;display:flex;gap:12px;align-items:center}.nav button[aria-current=page],.nav button:hover{background:var(--raised);color:var(--ink)}.nav button[aria-current=page]{box-shadow:inset 3px 0 var(--accent)}.nav span:first-child{font-size:13px;opacity:.7;font-variant-numeric:tabular-nums}.side-bottom{margin-top:auto;border-top:1px solid var(--line);padding-top:20px;font-size:14px;color:var(--muted)}.side-bottom a{display:block;margin-top:12px}.workspace{min-width:0}.topbar{min-height:86px;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 38px;border-bottom:1px solid var(--line)}.topbar-label{font-size:14px;color:var(--muted)}.preferences{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.preferences label{font-size:12px;color:var(--muted)}select{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:9px 12px;max-width:100%}.content{max-width:1400px;margin:auto;padding:32px 38px 60px}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}.eyebrow{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:var(--accent);font-weight:750}h1{font-size:clamp(28px,3.4vw,42px);line-height:1.15;letter-spacing:-1px;margin:10px 0}h2{font-size:23px;letter-spacing:-.5px;margin:0 0 14px}h3{font-size:18px;margin:0 0 10px}p{margin:8px 0 16px}.muted{color:var(--muted)}.status{padding:14px 18px;background:var(--raised);border:1px solid var(--line);border-radius:10px;margin-bottom:22px;font-size:14px}.status.error{color:var(--danger)}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:var(--accent-ink);padding:11px 18px;border:1px solid transparent;border-radius:9px;font-weight:650}.button.secondary{background:var(--surface);color:var(--ink);border-color:var(--line)}.button.text{background:none;color:var(--muted);padding:8px}.summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card{border:1px solid var(--line);background:var(--surface);border-radius:15px;padding:23px;box-shadow:var(--shadow);min-width:0}.label{font-size:14px;color:var(--muted);display:block;margin-bottom:12px}.stat{font-size:27px;font-weight:650;overflow-wrap:anywhere}.card small{display:block;font-size:13px;color:var(--muted);margin-top:8px}.split{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;margin-top:22px}.robot-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px}.mode{border:1px solid var(--line);border-radius:12px;padding:18px 14px;background:var(--raised)}.mode strong{display:block;font-size:17px}.mode p{font-size:14px;color:var(--muted);margin:7px 0 0}.mode[data-selected=true]{border-color:var(--accent)}.card-title{display:flex;justify-content:space-between;gap:15px;align-items:center}.tag{display:inline-block;font-size:12px;border:1px solid var(--line);border-radius:30px;padding:5px 10px;color:var(--muted)}.steps{padding-left:23px;color:var(--muted)}.steps li{padding:8px 0}.steps strong{color:var(--ink)}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.details{margin:0}.details div{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.details dt{color:var(--muted)}.details dd{margin:0;text-align:right;max-width:65%}.form-row{display:grid;gap:8px;margin:18px 0}.form-row label{font-size:14px;color:var(--muted)}.empty{padding:28px 0;color:var(--muted);font-size:15px}.activity{list-style:none;padding:0;margin:0}.activity li{padding:16px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px}.activity time{color:var(--muted);font-size:13px;white-space:nowrap}.notice{border-left:3px solid var(--accent);padding:12px 16px;background:var(--raised);font-size:14px;color:var(--muted)}.fund-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.fund-actions button{min-height:75px}.fund-actions span{display:block}.footer-note{margin-top:25px;font-size:13px;color:var(--muted)}dialog{width:min(520px,92vw);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:18px;padding:28px}dialog::backdrop{background:#020813aa}.skeleton{color:var(--muted)}@media(max-width:1050px){.layout{grid-template-columns:200px minmax(0,1fr)}.content,.topbar{padding-left:24px;padding-right:24px}.split{grid-template-columns:1fr}.summary{gap:10px}.card{padding:19px}.robot-strip{gap:8px}}@media(max-width:760px){.layout{display:block}.sidebar{position:static;height:auto;padding:18px;border-right:0;border-bottom:1px solid var(--line)}.brand small,.side-bottom{display:none}.nav{margin-top:18px;display:flex;overflow-x:auto;gap:6px;padding-bottom:3px}.nav button{white-space:nowrap;padding:10px 12px}.nav span:first-child{display:none}.topbar{padding:14px 18px;align-items:flex-start}.topbar-label{display:none}.content{padding:24px 18px}.summary{grid-template-columns:1fr}.summary .card{display:flex;align-items:center;justify-content:space-between;gap:12px}.summary small{display:none}.summary .label{margin:0}.stat{font-size:22px}.robot-strip{grid-template-columns:1fr}.page-head{flex-wrap:wrap}.fund-actions{grid-template-columns:1fr}.details div{flex-wrap:wrap}.details dd{max-width:100%}.preferences{gap:6px}.activity li{flex-direction:column;gap:4px}}
input{min-width:0;width:100%;background:var(--raised);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:11px}input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.preferences .button{font-size:13px;padding:8px 10px}.topbar{flex-wrap:wrap}.card .status{margin:20px 0 0}.mode:first-child strong{color:#73dcb2}.mode:nth-child(2) strong{color:#ffa5a0}.mode:nth-child(3) strong{color:#e5cd8a}:root[data-theme=light] .mode:first-child strong{color:#176744}:root[data-theme=light] .mode:nth-child(2) strong{color:#a03932}:root[data-theme=light] .mode:nth-child(3) strong{color:#796012}

/* BreathwealthFX Subscriber Academy Portal Styles */
.academy-portal-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.academy-banner-card {
  background: linear-gradient(135deg, rgba(215, 239, 135, 0.12), rgba(18, 29, 45, 0.95));
  border: 1px solid var(--accent);
  border-radius: 16px;
  padding: 1.75rem;
  box-shadow: var(--shadow);
}

.academy-banner-content h2 {
  font-size: 1.4rem;
  color: var(--ink);
  margin-bottom: 0.5rem;
}

.academy-banner-content p {
  color: var(--muted);
  font-size: 0.9rem;
  margin: 0;
  line-height: 1.5;
}

.academy-filter-row {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--line);
}

.academy-filter-tab {
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--muted);
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.2s ease;
}

.academy-filter-tab:hover,
.academy-filter-tab.active {
  background: var(--raised);
  color: var(--ink);
  border-color: var(--accent);
}

.academy-courses-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 1.25rem;
}

.course-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1rem;
  box-shadow: var(--shadow);
  transition: transform 0.2s ease, border-color 0.2s ease;
}

.course-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
}

.course-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.level-tag {
  font-size: 0.72rem;
  font-weight: 800;
  padding: 3px 8px;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.level-tag.level1 { background: rgba(0, 230, 118, 0.15); color: #00e676; border: 1px solid rgba(0, 230, 118, 0.3); }
.level-tag.level2 { background: rgba(56, 189, 248, 0.15); color: #38bdf8; border: 1px solid rgba(56, 189, 248, 0.3); }
.level-tag.level3 { background: rgba(255, 179, 0, 0.15); color: #ffb300; border: 1px solid rgba(255, 179, 0, 0.3); }
.level-tag.level4 { background: rgba(249, 115, 22, 0.15); color: #f97316; border: 1px solid rgba(249, 115, 22, 0.3); }
.level-tag.level5 { background: rgba(239, 68, 68, 0.15); color: #ef4444; border: 1px solid rgba(239, 68, 68, 0.3); }
.level-tag.specialist { background: rgba(168, 85, 247, 0.15); color: #a855f7; border: 1px solid rgba(168, 85, 247, 0.3); }

.course-num {
  font-size: 0.75rem;
  color: var(--muted);
  font-weight: 700;
  font-family: monospace;
}

.course-card-title h3 {
  font-size: 1.05rem;
  color: var(--ink);
  margin: 0.35rem 0 0.25rem;
}

.course-subtopics {
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.course-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--line);
  padding-top: 0.85rem;
}

.course-duration {
  font-size: 0.75rem;
  color: var(--muted);
}

.course-open-btn {
  background: var(--raised);
  border: 1px solid var(--line);
  color: var(--ink);
  padding: 6px 14px;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.course-open-btn:hover {
  background: var(--accent);
  color: var(--accent-ink);
  border-color: var(--accent);
}

/* Course Reader Dialog Modal */
dialog#courseDialog {
  width: min(850px, 94vw);
  max-height: 90vh;
  overflow-y: auto;
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--accent);
  border-radius: 18px;
  padding: 2rem;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7);
}

.course-dialog-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--line);
  padding-bottom: 1rem;
  margin-bottom: 1.25rem;
}

.course-dialog-title h2 {
  font-size: 1.35rem;
  color: var(--ink);
  margin: 0.35rem 0 0.25rem;
}

.course-dialog-body {
  font-size: 0.9rem;
  color: var(--ink);
  line-height: 1.65;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.course-topic-block {
  background: var(--raised);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 1.25rem;
}

.course-topic-block h4 {
  margin: 0 0 0.5rem;
  color: var(--accent);
  font-size: 1rem;
}

.broker-recommendation-box {
  background: rgba(56, 189, 248, 0.1);
  border: 1px solid rgba(56, 189, 248, 0.3);
  border-radius: 10px;
  padding: 1rem 1.25rem;
  color: var(--ink);
  margin-top: 1rem;
}

.broker-recommendation-box h5 {
  margin: 0 0 0.5rem;
  color: #38bdf8;
  font-size: 0.95rem;
}

.broker-link-btn {
  display: inline-block;
  margin-top: 0.5rem;
  background: #38bdf8;
  color: #000;
  font-weight: bold;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 0.85rem;
}

/* Course Visual Diagrams & Illustration Container */
.course-visual-illustration {
  background: linear-gradient(135deg, rgba(18, 29, 45, 0.95), rgba(11, 17, 27, 0.98));
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 1.25rem;
  margin-bottom: 1rem;
  text-align: center;
}

.course-visual-illustration svg {
  width: 100%;
  max-width: 720px;
  height: auto;
  display: block;
  margin: 0 auto;
}

.course-visual-caption {
  font-size: 0.78rem;
  color: var(--muted);
  margin-top: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.3px;
}

/* Academy Progress Card */
.academy-progress-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1.25rem;
  box-shadow: var(--shadow);
}

.academy-progress-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.course-completed-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  font-weight: 800;
  color: #00e676;
  background: rgba(0, 230, 118, 0.15);
  border: 1px solid rgba(0, 230, 118, 0.3);
  padding: 3px 8px;
  border-radius: 12px;
}

@media print {
  body * { visibility: hidden; }
  #certificateDialog, #certificateDialog * { visibility: visible; }
  #certificateDialog { position: absolute; left: 0; top: 0; width: 100% !important; border: 0 !important; box-shadow: none !important; }
  #certificateDialog button { display: none !important; }
}




/* Featured VPS Preview Card Styling */
.featured-vps-card {
  border: 2px solid #ff9800 !important;
  box-shadow: 0 0 20px rgba(255, 152, 0, 0.25) !important;
  background: linear-gradient(145deg, rgba(255, 152, 0, 0.08) 0%, var(--surface) 100%) !important;
}

.featured-vps-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 25px rgba(255, 152, 0, 0.4) !important;
}


/* Enhanced Course Reader Modal & Interactive Topic Tabs */
dialog#courseDialog {
  width: min(940px, 95vw) !important;
  max-height: 90vh !important;
  overflow-y: auto !important;
  background: var(--surface) !important;
  color: var(--ink) !important;
  border: 1px solid var(--accent) !important;
  border-radius: 18px !important;
  padding: 1.75rem 2rem !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7) !important;
}

.course-topic-tabs-strip {
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding-bottom: 0.75rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--line);
}

.course-topic-tab-btn {
  background: var(--raised);
  border: 1px solid var(--line);
  color: var(--muted);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.2s ease;
}

.course-topic-tab-btn:hover,
.course-topic-tab-btn.active {
  background: var(--accent);
  color: var(--accent-ink);
  border-color: var(--accent);
}

.course-topic-deep-card {
  background: var(--raised);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1.5rem;
  margin-bottom: 1.25rem;
  box-shadow: var(--shadow);
}

.course-topic-deep-card h3 {
  color: var(--accent);
  font-size: 1.2rem;
  margin: 0 0 0.85rem;
  border-bottom: 1px dashed var(--line);
  padding-bottom: 0.5rem;
  letter-spacing: -0.3px;
}

.course-topic-deep-card h4 {
  color: #38bdf8;
  font-size: 1.05rem;
  margin: 1.2rem 0 0.5rem;
}

.course-topic-deep-card p {
  margin: 0 0 1rem;
  color: var(--ink);
  font-size: 0.92rem;
  line-height: 1.7;
}

.course-topic-deep-card ul, 
.course-topic-deep-card ol {
  margin: 0.5rem 0 1.2rem 1.2rem;
  padding: 0;
  color: var(--ink);
}

.course-topic-deep-card li {
  margin-bottom: 0.5rem;
  line-height: 1.6;
}

.course-topic-deep-card strong {
  color: #fff;
}

.lesson-callout-box {
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.1), rgba(18, 29, 45, 0.8));
  border-left: 4px solid #38bdf8;
  border-radius: 8px;
  padding: 1rem 1.25rem;
  margin: 1rem 0;
  font-size: 0.9rem;
}

.lesson-callout-box.gold {
  background: linear-gradient(135deg, rgba(255, 184, 0, 0.12), rgba(18, 29, 45, 0.8));
  border-left-color: #ffb800;
}

.lesson-callout-box.green {
  background: linear-gradient(135deg, rgba(0, 230, 118, 0.12), rgba(18, 29, 45, 0.8));
  border-left-color: #00e676;
}

.lesson-code-block {
  background: #080d16;
  border: 1px solid #1e2d42;
  border-radius: 8px;
  padding: 1rem;
  font-family: Consolas, Monaco, monospace;
  font-size: 0.85rem;
  color: #73dcb2;
  overflow-x: auto;
  white-space: pre;
  margin: 1rem 0;
}

.lesson-downloads-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.download-tool-card {
  background: #111a28;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0.75rem;
}

.download-tool-card strong {
  color: #fff;
  font-size: 0.95rem;
}

.download-tool-card p {
  color: var(--muted);
  font-size: 0.8rem;
  margin: 0;
  line-height: 1.4;
}

.download-tool-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: rgba(56, 189, 248, 0.15);
  color: #38bdf8;
  border: 1px solid rgba(56, 189, 248, 0.4);
  border-radius: 6px;
  padding: 7px 12px;
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.2s ease;
}

.download-tool-btn:hover {
  background: #38bdf8;
  color: #000;
}