/* CyberByte 5 visual layer: aurora background, glass chrome, card library,
   certification hub and motion. Loaded last so it can refine earlier sheets. */
:root{
  --cyan:#38bdf8;--violet:#a78bfa;--mint:#34d399;--rose:#fb7185;--gold:#fbbf24;--teal:#2dd4bf;--pink:#f472b6;--orange:#fb923c;
  --grad:linear-gradient(125deg,#34d399 0%,#38bdf8 50%,#a78bfa 100%);
  --glass:rgba(14,18,27,.76);--line:rgba(148,163,184,.16);--card:rgba(16,20,30,.78);
  --ease:cubic-bezier(.2,.8,.2,1);
}
body{background:#0b0b0c}
body:before,body:after{content:'';position:fixed;inset:-20vmax;z-index:-2;pointer-events:none}
body:before{
  background:
    radial-gradient(38vmax 38vmax at 12% 8%,rgba(181,184,188,.13),transparent 60%),
    radial-gradient(42vmax 42vmax at 88% 18%,rgba(192,194,197,.14),transparent 60%),
    radial-gradient(40vmax 40vmax at 60% 100%,rgba(147,151,157,.11),transparent 60%);
  animation:aurora 26s ease-in-out infinite alternate;
}
body:after{
  inset:0;z-index:-1;opacity:.5;
  background-image:linear-gradient(rgba(181,184,188,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(181,184,188,.035) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(ellipse at 50% 0%,#000000 30%,transparent 75%);
}
@keyframes aurora{0%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(-3vmax,2vmax,0) rotate(6deg)}100%{transform:translate3d(2vmax,-2vmax,0) rotate(-4deg)}}

/* Glass chrome */
.topbar.site-header{background:rgba(12,12,13,.72)!important;backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);border-bottom:1px solid transparent!important;border-image:linear-gradient(90deg,transparent,rgba(181,184,188,.35),rgba(192,194,197,.35),transparent) 1!important}
.sidebar{background:linear-gradient(180deg,rgba(16,16,17,.92),rgba(16,17,18,.92))!important;backdrop-filter:blur(12px)}
.page-footer{background:transparent}
.brand-symbol img{transition:transform .6s var(--ease),filter .4s}
.brand:hover .brand-symbol img{transform:rotate(-8deg) scale(1.08);filter:drop-shadow(0 0 10px rgba(181,184,188,.6))}
.brand .mint,.boot-title span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.gradient-text{background:var(--grad);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:grad-pan 6s linear infinite}
@keyframes grad-pan{to{background-position:200% center}}
.header-link{position:relative}
.header-link.active:after,.header-link[aria-current]:after{background:var(--grad)!important;box-shadow:0 0 12px rgba(147,151,157,.6)}
.nav-item.active,.nav-item[aria-current]{background:linear-gradient(90deg,rgba(181,184,188,.14),rgba(147,151,157,.05))!important;box-shadow:inset 0 0 0 1px rgba(181,184,188,.22)}
.nav-new{margin-left:auto;font-size:9px;font-weight:700;letter-spacing:.6px;padding:2px 6px;border-radius:999px;color:#0d0e0f;background:var(--grad);animation:pulse-glow 2.4s ease-in-out infinite}
@keyframes pulse-glow{50%{box-shadow:0 0 14px rgba(181,184,188,.55)}}

/* Buttons and panels */
.button.primary{background:var(--grad)!important;border:0!important;color:#0d0d0e!important;position:relative;overflow:hidden;background-size:160% auto!important;transition:background-position .5s var(--ease),transform .2s var(--ease),box-shadow .3s}
.button.primary:hover{background-position:right center!important;box-shadow:0 8px 26px rgba(147,151,157,.35),0 0 0 1px rgba(255,255,255,.12) inset}
.button.primary:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s var(--ease)}
.button.primary:hover:after{transform:translateX(120%)}
.panel,.stat-card{background:var(--card)!important;border-color:var(--line)!important;backdrop-filter:blur(10px)}
.stat-card{position:relative;overflow:hidden;transition:transform .3s var(--ease),border-color .3s}
.stat-card:hover{transform:translateY(-3px);border-color:rgba(181,184,188,.35)!important}
.page-intro h1{background:linear-gradient(180deg,#ffffff,#c2c4c7);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Spotlight that follows the pointer (set by spice.js) */
.spot{position:relative;isolation:isolate}
.spot:before{content:'';position:absolute;inset:0;border-radius:inherit;z-index:-1;opacity:0;transition:opacity .35s;background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),var(--spot,rgba(181,184,188,.14)),transparent 45%)}
.spot:hover:before{opacity:1}

/* Domain colours */
.dom-web{--dc:var(--mint)}.dom-siem{--dc:var(--violet)}.dom-network{--dc:var(--gold)}.dom-crypto{--dc:var(--cyan)}
.dom-cloud{--dc:var(--teal)}.dom-reversing{--dc:var(--rose)}.dom-osint{--dc:var(--pink)}.dom-puzzle{--dc:var(--orange)}

/* Library: filters */
.filter-panel{padding:18px!important}
.domain-tabs{gap:9px!important}
.filter-chip{font-size:12.5px!important;padding:8px 13px!important;border-radius:999px!important;border-color:var(--line)!important;background:rgba(255,255,255,.02)!important;color:#bec0c3!important}
.filter-chip .icon{width:15px;height:15px;color:var(--dc,var(--mint))}
.filter-chip small{font-size:11px!important;padding:1px 7px;border-radius:999px;background:rgba(255,255,255,.06)}
.filter-chip.active{color:#0d0d0e!important;background:var(--dc,var(--mint))!important;border-color:transparent!important;box-shadow:0 0 22px color-mix(in srgb,var(--dc,var(--mint)) 45%,transparent)}
.filter-chip.active .icon{color:#0d0d0e}
.filter-chip.active small{background:rgba(0,0,0,.15)}
.results-summary{font-size:12.5px!important}
.view-toggle{display:inline-flex;padding:3px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.view-toggle button{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:#a6a9ae;font-size:12px;padding:6px 12px;border-radius:999px;cursor:pointer}
.view-toggle button .icon{width:14px;height:14px}
.view-toggle button.active{background:rgba(181,184,188,.16);color:var(--mint)}
.view-toggle button:hover{transform:none!important;box-shadow:none!important}

/* Library: challenge cards */
.grid-results .pagination{border:1px solid var(--line);border-radius:14px;margin-top:16px;background:var(--card)}
.challenge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
.challenge-card{--dc:var(--mint);position:relative;display:flex;flex-direction:column;gap:10px;padding:18px 18px 14px;border-radius:16px;cursor:pointer;overflow:hidden;
  background:linear-gradient(160deg,color-mix(in srgb,var(--dc) 9%,rgba(23,24,26,.9)),rgba(18,19,20,.92) 55%);
  border:1px solid color-mix(in srgb,var(--dc) 18%,transparent);
  transition:transform .35s var(--ease),border-color .3s,box-shadow .35s;
  animation:card-in .55s var(--ease) both;animation-delay:calc(var(--i,0)*45ms)}
.challenge-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--dc) 55%,transparent);box-shadow:0 18px 40px rgba(0,0,0,.4),0 0 32px color-mix(in srgb,var(--dc) 20%,transparent)}
.challenge-card:after{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--dc),transparent);opacity:.7}
.cc-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(300px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--dc) 18%,transparent),transparent 45%);opacity:0;transition:opacity .3s}
.challenge-card:hover .cc-glow{opacity:1}
@keyframes card-in{from{opacity:0;transform:translateY(16px) scale(.98)}}
.cc-top{display:flex;align-items:center;gap:9px}
.cc-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:var(--dc);background:color-mix(in srgb,var(--dc) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dc) 30%,transparent);transition:transform .4s var(--ease)}
.challenge-card:hover .cc-icon{transform:rotate(-8deg) scale(1.08)}
.cc-icon .icon{width:18px;height:18px}
.cc-domain{font-size:11.5px;letter-spacing:.4px;text-transform:uppercase;color:var(--dc);font-weight:600}
.cc-top .save-button{margin-left:auto}
.cc-title{color:#f2f2f2;font-size:15.5px;font-weight:650;line-height:1.35;letter-spacing:-.2px}
.cc-title:hover{color:#ffffff}
.cc-desc{margin:0;color:#9a9ea3;font-size:12.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.cc-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;color:#a6a9ae}
.cc-time{display:inline-flex;align-items:center;gap:4px}.cc-time .icon{width:13px;height:13px}
.cc-xp{margin-left:auto;font-weight:700;color:var(--gold);font-family:"JetBrains Mono",monospace;font-size:12px}
.cc-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed var(--line);padding-top:10px;font-size:11px}
.cc-id{font-family:"JetBrains Mono",monospace;color:#676b70}
.cc-go,.cc-done{display:inline-flex;align-items:center;gap:5px;color:var(--dc);font-weight:600}
.cc-go .icon,.cc-done .icon{width:13px;height:13px;transition:transform .3s var(--ease)}
.challenge-card:hover .cc-go .icon{transform:translateX(4px)}
.challenge-card.is-solved{opacity:.85}
.challenge-card.is-solved .cc-done{color:var(--mint)}
.difficulty{font-size:11px!important;padding:3px 9px!important;border-radius:999px!important;font-weight:600;letter-spacing:.2px}
.difficulty.Easy{box-shadow:0 0 0 1px rgba(181,184,188,.3) inset}
.difficulty.Medium{box-shadow:0 0 0 1px rgba(138,143,149,.3) inset}
.difficulty.Hard{box-shadow:0 0 0 1px rgba(179,181,185,.35) inset}
.challenge-row td{transition:background .2s}
.challenge-row:hover td{background:rgba(181,184,188,.04)}
.library-banner{transition:transform .35s var(--ease),box-shadow .35s!important}
.library-banner:hover{transform:translateY(-4px) rotate(-.4deg);box-shadow:0 16px 36px rgba(0,0,0,.35)}

/* Scroll reveal (spice.js adds .rv and .in) */
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--rd,0ms)}
.rv.in{opacity:1;transform:none}

/* Certification hub */
.cert-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(240px,.8fr);gap:30px;align-items:center;padding:34px 36px;border-radius:22px;margin-bottom:34px;position:relative;overflow:hidden;
  background:radial-gradient(600px 300px at 0% 0%,rgba(181,184,188,.14),transparent 60%),radial-gradient(500px 300px at 100% 100%,rgba(192,194,197,.18),transparent 60%),rgba(20,21,22,.8);border:1px solid var(--line)}
.cert-hero h1{font-size:clamp(30px,4vw,46px);line-height:1.08;letter-spacing:-1.4px;margin:10px 0 14px}
.cert-hero p{color:#adb0b5;font-size:15px;max-width:560px;margin:0 0 22px;line-height:1.6}
.cert-hero .eyebrow,.guide-hero .eyebrow,.result-hero .eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;color:var(--mint)}
.eyebrow .icon{width:14px;height:14px}
.cert-hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.cert-orbit{position:relative;width:260px;height:260px;margin:auto}
.cert-orbit>span{position:absolute;left:50%;top:50%;margin:-24px;animation:orbit 24s linear infinite;--r:108px;transform:rotate(var(--a)) translate(var(--r)) rotate(calc(-1*var(--a)))}
.cert-orbit:hover>span{animation-play-state:paused}
@keyframes orbit{from{transform:rotate(var(--a)) translate(var(--r)) rotate(calc(-1*var(--a)))}to{transform:rotate(calc(var(--a) + 360deg)) translate(var(--r)) rotate(calc(-1*var(--a) - 360deg))}}
.cert-orbit:before{content:'';position:absolute;inset:22px;border-radius:50%;border:1px dashed rgba(181,184,188,.25)}
.orbit-core{position:absolute;inset:80px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(181,184,188,.25),rgba(147,151,157,.05) 70%);box-shadow:0 0 60px rgba(147,151,157,.3);animation:core-breathe 4s ease-in-out infinite}
.orbit-core .icon{width:44px;height:44px;color:var(--mint)}
@keyframes core-breathe{50%{transform:scale(1.07);box-shadow:0 0 90px rgba(181,184,188,.4)}}

.cert-badge{--bc:var(--mint);position:relative;display:inline-grid;place-items:center;width:58px;height:58px;flex-shrink:0}
.cert-badge svg{position:absolute;inset:0;width:100%;height:100%}
.cert-badge .cb-hex{fill:color-mix(in srgb,var(--bc) 16%,#101112);stroke:var(--bc);stroke-width:2.5}
.cert-badge .cb-ring{fill:none;stroke:color-mix(in srgb,var(--bc) 45%,transparent);stroke-width:1.2;stroke-dasharray:3 3}
.cert-badge b{position:relative;font-size:12.5px;font-weight:800;color:var(--bc);letter-spacing:-.2px}
.cert-badge.sm{width:48px;height:48px}.cert-badge.sm b{font-size:11px}
.cert-badge.lg{width:96px;height:96px}.cert-badge.lg b{font-size:19px}
.cert-badge.mint,.cert-card.mint,.guide-hero.mint{--bc:var(--mint)}.cert-badge.blue,.cert-card.blue,.guide-hero.blue{--bc:var(--cyan)}
.cert-badge.amber,.cert-card.amber,.guide-hero.amber{--bc:var(--gold)}.cert-badge.purple,.cert-card.purple,.guide-hero.purple{--bc:var(--violet)}
.cert-badge.rose,.cert-card.rose,.guide-hero.rose{--bc:var(--rose)}.cert-badge.slate,.cert-card.slate,.guide-hero.slate{--bc:#b5b8bc}
.cert-badge.lg svg{filter:drop-shadow(0 0 18px color-mix(in srgb,var(--bc) 45%,transparent))}

.cert-roadmap{list-style:none;padding:0;margin:0 0 36px;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;position:relative}
.cert-roadmap:before{content:'';position:absolute;left:4%;right:4%;top:34px;height:2px;background:var(--grad);opacity:.35}
.cert-roadmap li{animation:card-in .6s var(--ease) both;animation-delay:calc(var(--i)*90ms)}
.cert-roadmap a{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:10px 6px;border-radius:14px;color:inherit;transition:transform .3s var(--ease),background .3s}
.cert-roadmap a:hover{transform:translateY(-4px);background:rgba(255,255,255,.03)}
.cert-roadmap small{display:block;color:#868b91;font-size:11px}
.cert-roadmap strong{font-size:12.5px;line-height:1.3}

.cert-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-bottom:24px}
.cert-card{--bc:var(--mint);position:relative;padding:22px;border-radius:18px;display:flex;flex-direction:column;gap:6px;overflow:hidden;
  background:linear-gradient(165deg,color-mix(in srgb,var(--bc) 10%,rgba(22,23,24,.92)),rgba(17,18,19,.94) 60%);border:1px solid color-mix(in srgb,var(--bc) 22%,transparent);
  transition:transform .35s var(--ease),box-shadow .35s,border-color .3s;animation:card-in .6s var(--ease) both;animation-delay:calc(var(--i)*70ms)}
.cert-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--bc) 60%,transparent);box-shadow:0 22px 50px rgba(0,0,0,.45),0 0 40px color-mix(in srgb,var(--bc) 18%,transparent)}
.cert-card h3{margin:10px 0 0;font-size:18px;letter-spacing:-.3px}
.cert-card p{margin:0;color:#a5a8ac;font-size:13px;line-height:1.55}
.cert-card .cert-code{color:var(--bc);font-size:12px;font-weight:600}
.cert-card-top{display:flex;justify-content:space-between;align-items:flex-start}
.cert-mini-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.cert-mini-facts div{padding:9px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
.cert-mini-facts dt{font-size:10.5px;color:#7c8187;text-transform:uppercase;letter-spacing:.5px}
.cert-mini-facts dd{margin:2px 0 0;font-weight:700;font-size:13px}
.cert-card-actions{display:flex;gap:8px;margin-top:auto;flex-wrap:wrap}
.cert-card-actions .button{flex:1;justify-content:center}
.ready-pill{font-size:11px;font-weight:650;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.06);color:#a6a9ae;white-space:nowrap}
.ready-pill.ready{background:rgba(181,184,188,.16);color:var(--mint)}
.ready-pill.close{background:rgba(138,143,149,.15);color:var(--gold)}
.ready-pill.learning{background:rgba(147,151,157,.14);color:var(--cyan)}

.guide-hero{--bc:var(--mint);display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:26px;align-items:center;padding:28px 30px;border-radius:22px;margin-bottom:18px;
  background:radial-gradient(500px 260px at 0% 0%,color-mix(in srgb,var(--bc) 18%,transparent),transparent 60%),rgba(20,21,22,.82);border:1px solid color-mix(in srgb,var(--bc) 25%,transparent)}
.guide-hero h1{font-size:clamp(26px,3vw,36px);margin:6px 0 8px;letter-spacing:-1px}
.guide-hero p{color:#adb0b5;margin:0 0 16px;max-width:620px}
.guide-readiness{display:flex;flex-direction:column;align-items:center;gap:6px}
.guide-readiness .progress-ring{margin:0;width:110px;height:110px;background:conic-gradient(var(--bc) var(--completion),rgba(255,255,255,.07) 0)}
.fact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:0 0 22px}
.fact-grid div{padding:14px 16px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.fact-grid dt{font-size:11px;color:#868b91;text-transform:uppercase;letter-spacing:.6px}
.fact-grid dd{margin:4px 0 0;font-weight:650;font-size:14px;line-height:1.4}
.weight-panel{padding:22px 24px!important;margin-bottom:28px}
.weight-panel h2,.tips-panel h2{display:flex;align-items:center;gap:9px;font-size:18px;margin:0 0 14px}
.weight-panel h2 .icon,.tips-panel h2 .icon{width:18px;height:18px;color:var(--mint)}
.weight-row{display:grid;grid-template-columns:minmax(150px,1.2fr) 2fr 52px;gap:14px;align-items:center;padding:8px 0;font-size:13.5px}
.weight-row b{text-align:right;font-family:"JetBrains Mono",monospace;color:var(--mint)}
.weight-bar{height:9px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden}
.weight-bar i{display:block;height:100%;width:var(--w);border-radius:inherit;background:var(--grad);transform-origin:left;animation:bar-grow 1.1s var(--ease) both;animation-delay:calc(var(--i)*90ms + 150ms)}
@keyframes bar-grow{from{transform:scaleX(0)}}
.weight-row.good b{color:var(--mint)}.weight-row.mid b{color:var(--gold)}.weight-row.low b{color:var(--rose)}
.weight-row.mid .weight-bar i{background:linear-gradient(90deg,#8a8f95,#979ba0)}.weight-row.low .weight-bar i{background:linear-gradient(90deg,#b3b5b9,#95999e)}
.week-plan{list-style:none;padding:0;margin:0 0 30px;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.week-plan>li{display:flex;gap:14px;padding:18px;border-radius:16px;background:var(--card);border:1px solid var(--line);animation:card-in .6s var(--ease) both;animation-delay:calc(var(--i)*70ms)}
.week-dot{flex-shrink:0;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#0d0d0e;background:var(--grad)}
.week-plan strong{display:block;font-size:15px}.week-plan em{display:block;font-style:normal;color:var(--mint);font-size:12.5px;margin:2px 0 8px}
.week-plan ul{margin:0;padding-left:17px;color:#a6a9ae;font-size:12.5px;line-height:1.7}
.week-plan a{color:var(--cyan)}
.domain-notes{display:grid;gap:12px;margin-bottom:30px}
.domain-note{border-radius:16px;background:var(--card);border:1px solid var(--line);overflow:hidden;transition:border-color .3s}
.domain-note[open]{border-color:rgba(181,184,188,.35)}
.domain-note summary{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px 18px;cursor:pointer;list-style:none}
.domain-note summary::-webkit-details-marker{display:none}
.domain-note summary strong{display:block;font-size:15px}.domain-note summary small{color:#95999f;font-size:12.5px}
.dn-num{font-family:"JetBrains Mono",monospace;font-size:20px;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.dn-weight{font-weight:700;color:var(--mint);padding:4px 10px;border-radius:999px;background:rgba(181,184,188,.1)}
.domain-note ul{margin:0;padding:0 22px 6px 50px;color:#cccdce;font-size:13.5px;line-height:1.75}
.domain-note .button{margin:10px 18px 18px 50px}
.domain-note[open] ul{animation:card-in .4s var(--ease)}
.tips-panel{padding:22px 24px!important;margin-bottom:24px}
.tips-panel ul{margin:0;padding-left:20px;color:#cccdce;line-height:1.85;font-size:13.5px}

/* Practice exam */
.exam-setup{text-align:center;max-width:720px;margin:10px auto 40px;display:flex;flex-direction:column;align-items:center;gap:6px}
.exam-setup h1{font-size:30px;margin:14px 0 4px;letter-spacing:-.8px}
.exam-setup p{color:#a6a9ae;margin:0 0 22px}
.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%}
.mode-card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;padding:22px;border-radius:18px;cursor:pointer;color:inherit;background:var(--card);border:1px solid var(--line);transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
.mode-card:hover{border-color:rgba(181,184,188,.5)!important;box-shadow:0 16px 40px rgba(0,0,0,.4),0 0 30px rgba(181,184,188,.12)!important;transform:translateY(-4px)!important}
.mode-card .icon{width:26px;height:26px;color:var(--mint)}
.mode-card strong{font-size:17px}.mode-card span{color:#a6a9ae;font-size:13px;line-height:1.5}
.exam-shell{max-width:820px;margin:0 auto}
.exam-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.exam-top .back-link{margin:0}
.exam-title{display:inline-flex;align-items:center;gap:10px;font-weight:650}
.exam-timer,.exam-count{font-family:"JetBrains Mono",monospace;font-weight:700;padding:6px 12px;border-radius:999px;background:rgba(181,184,188,.12);color:var(--mint)}
.exam-timer.low{background:rgba(179,181,185,.16);color:var(--rose);animation:pulse-glow 1s infinite}
.exam-progress{height:6px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden;margin-bottom:18px}
.exam-progress i{display:block;height:100%;background:var(--grad);border-radius:inherit;transition:width .5s var(--ease);box-shadow:0 0 12px rgba(147,151,157,.6)}
.question-card{padding:28px;border-radius:20px;background:var(--card);border:1px solid var(--line);animation:q-in .45s var(--ease)}
@keyframes q-in{from{opacity:0;transform:translateX(24px)}}
.q-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:#95999f;font-size:12.5px}
.q-meta .tag{margin:0}
.flag-btn{margin-left:auto;display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:none;color:#a6a9ae;border-radius:999px;padding:5px 11px;font-size:12px;cursor:pointer}
.flag-btn .icon{width:13px;height:13px}.flag-btn.on{color:var(--gold);border-color:rgba(138,143,149,.5)}
.question-card h2{font-size:20px;line-height:1.45;margin:14px 0 20px;letter-spacing:-.2px;font-weight:620}
.options{display:grid;gap:10px}
.option{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:15px 16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025);color:#e0e1e2;font-size:14.5px;cursor:pointer;transition:transform .2s var(--ease),border-color .2s,background .2s}
.option:hover:not(:disabled){border-color:rgba(181,184,188,.5)!important;background:rgba(181,184,188,.06);transform:translateX(4px)!important}
.option kbd{flex-shrink:0;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:700;background:rgba(255,255,255,.06);border:1px solid var(--line)}
.option span{flex:1}
.option>.icon{width:20px;height:20px}
.option.picked{border-color:var(--cyan);background:rgba(147,151,157,.1)}.option.picked kbd{background:var(--cyan);color:#0d0d0e}
.option.correct{border-color:var(--mint);background:rgba(181,184,188,.12);color:#ffffff;animation:pop .4s var(--ease)}.option.correct kbd{background:var(--mint);color:#0d0d0e}.option.correct>.icon{color:var(--mint)}
.option.wrong{border-color:var(--rose);background:rgba(179,181,185,.1);animation:shake .4s}.option.wrong kbd{background:var(--rose);color:#0d0d0e}.option.wrong>.icon{color:var(--rose)}
.option.dim{opacity:.5}
.option:disabled{cursor:default}
@keyframes pop{50%{transform:scale(1.02)}}
@keyframes shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.explanation{margin-top:18px;padding:15px 17px;border-radius:14px;font-size:14px;line-height:1.6;animation:card-in .4s var(--ease)}
.explanation.good{background:rgba(181,184,188,.08);border:1px solid rgba(181,184,188,.3)}.explanation.good strong{color:var(--mint)}
.explanation.bad{background:rgba(179,181,185,.07);border:1px solid rgba(179,181,185,.3)}.explanation.bad strong{color:var(--rose)}
.exam-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px}
.q-dots{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;max-width:430px}
.q-dot{width:11px;height:11px;border-radius:50%;border:1px solid var(--line)!important;background:rgba(255,255,255,.06);padding:0;cursor:pointer}
.q-dot:hover{transform:scale(1.3)!important;box-shadow:none!important}
.q-dot.done{background:var(--cyan)}.q-dot.flag{background:var(--gold)}.q-dot.here{outline:2px solid var(--mint);outline-offset:2px}
.exam-hint{text-align:center;color:#73777d;font-size:12px;margin-top:16px}
.exam-hint kbd{font-family:"JetBrains Mono",monospace;padding:1px 6px;border-radius:5px;border:1px solid var(--line)}
.result-hero{display:grid;grid-template-columns:auto 1fr;gap:30px;align-items:center;padding:30px;border-radius:22px;margin-bottom:22px;background:rgba(20,21,22,.82);border:1px solid var(--line)}
.result-hero h1{font-size:32px;margin:6px 0 8px;letter-spacing:-1px}.result-hero p{color:#adb0b5;margin:0 0 16px}
.result-hero.ready{background:radial-gradient(500px 260px at 0 0,rgba(181,184,188,.18),transparent 60%),rgba(20,21,22,.82)}
.result-hero.close{background:radial-gradient(500px 260px at 0 0,rgba(138,143,149,.15),transparent 60%),rgba(20,21,22,.82)}
.result-hero.learning{background:radial-gradient(500px 260px at 0 0,rgba(147,151,157,.15),transparent 60%),rgba(20,21,22,.82)}
.score-ring{--c:var(--mint);width:150px;height:150px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(var(--c) var(--completion),rgba(255,255,255,.07) 0);animation:ring-in 1.2s var(--ease)}
.result-hero.close .score-ring{--c:var(--gold)}.result-hero.learning .score-ring{--c:var(--cyan)}
.score-ring:before{content:'';position:absolute;inset:11px;border-radius:50%;background:#131314}
.score-ring span{position:relative;font-size:34px;font-weight:800;text-align:center;line-height:1}
.score-ring small{display:block;font-size:12px;font-weight:500;color:#95999f;margin-top:6px}
@keyframes ring-in{from{transform:rotate(-90deg) scale(.7);opacity:0}}
.review-list{display:grid;gap:10px;margin-bottom:30px}
.review-item{border-radius:14px;background:var(--card);border:1px solid var(--line);padding:4px 16px}
.review-item.miss{border-color:rgba(179,181,185,.3)}
.review-item summary{display:flex;gap:10px;align-items:flex-start;padding:12px 0;cursor:pointer;list-style:none;font-weight:550;line-height:1.45}
.review-item summary::-webkit-details-marker{display:none}
.ri-icon .icon{width:18px;height:18px}.review-item.ok .ri-icon{color:var(--mint)}.review-item.miss .ri-icon{color:var(--rose)}
.review-item p{margin:0 0 10px 28px;font-size:13.5px;line-height:1.6}

/* Boot screen: byte rain canvas and new mark */
.boot-matrix{position:absolute;inset:0;width:100%;height:100%;opacity:.35;pointer-events:none}
.boot-mark img{filter:drop-shadow(0 0 28px rgba(147,151,157,.45));animation:mark-float 3.5s ease-in-out infinite}
@keyframes mark-float{50%{transform:translateY(-6px)}}
.boot-progress-track span{background:var(--grad)!important;box-shadow:0 0 14px rgba(147,151,157,.7)}

/* Static hosting: no account backend */
.static-site #signin-cta,.static-site #cloud-status{display:none!important}

@media(max-width:900px){
  .cert-hero{grid-template-columns:1fr;padding:26px 22px}.cert-orbit{width:220px;height:220px}.cert-orbit>span{--r:90px}.orbit-core{inset:66px}
  .cert-roadmap{grid-template-columns:repeat(3,1fr)}.cert-roadmap:before{display:none}
  .guide-hero{grid-template-columns:1fr;text-align:left}.guide-readiness{flex-direction:row;justify-content:flex-start}
  .result-hero{grid-template-columns:1fr;justify-items:start}
}
@media(max-width:600px){
  .mode-grid{grid-template-columns:1fr}.cert-roadmap{grid-template-columns:repeat(2,1fr)}
  .weight-row{grid-template-columns:1fr 46px}.weight-row .weight-bar{grid-column:1/-1;grid-row:2}
  .question-card{padding:20px}.question-card h2{font-size:17px}
  .exam-nav{flex-wrap:wrap}.q-dots{order:3;width:100%;max-width:none}
  .challenge-grid{grid-template-columns:1fr}
  .domain-note ul{padding-left:22px}.domain-note .button{margin-left:18px}
}
.motion-off body:before,.motion-off .gradient-text,.motion-off .cert-orbit>span,.motion-off .orbit-core,.motion-off .nav-new,.motion-off .boot-mark img{animation:none!important}
.motion-off .rv{opacity:1;transform:none;transition:none}
.motion-off .challenge-card,.motion-off .cert-card,.motion-off .week-plan>li,.motion-off .cert-roadmap li,.motion-off .question-card,.motion-off .weight-bar i{animation:none!important}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}