/* Huny by ESGIB — learner app styles.
 * Everything is scoped under .huny-root and resets the theme's button/link/input
 * styles (Hello Elementor colours buttons pink by default), so the app looks the
 * same whatever the theme or Elementor kit sets. */

.huny-root {
  --ink: #14162B; --ink2: #4A4D63; --honey: #FF9F1A; --honey-d: #C97700; --honey-t: #8A4B00; --honey-s: #FFF4E3;
  --leaf: #1F8A4C; --leaf-t: #17663A; --leaf-s: #E6F4EC; --red: #C2362B; --red-s: #FDECEA; --blue: #0E5BDD;
  --bg: #FFFFFF; --surface: #F6F4EF; --line: #E4E1D9; --radius: 16px;
  --hex: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--ink); font-size: 17px; line-height: 1.5; max-width: 1080px; margin: 0 auto; padding: 0 16px 48px;
  -webkit-text-size-adjust: 100%; box-sizing: border-box;
}
.huny-root *, .huny-root *::before, .huny-root *::after { box-sizing: border-box; }
.huny-root h1, .huny-root h2, .huny-root h3 { font-family: 'Bricolage Grotesque', 'Figtree', sans-serif; color: var(--ink); line-height: 1.15; margin: 0 0 .4em; font-weight: 800; letter-spacing: -.01em; text-transform: none; }
.huny-root h1 { font-size: clamp(26px, 4vw, 38px); }
.huny-root h2 { font-size: clamp(20px, 2.6vw, 26px); }
.huny-root h3 { font-size: 18px; margin-top: 1em; }
.huny-root p { margin: 0 0 .8em; }
.huny-root a { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; }
.huny-root a:hover { color: #0A46A8; }

/* Theme button reset */
.huny-root button, .huny-root [type="button"], .huny-root [type="submit"] {
  font: inherit; color: inherit; background: none; border: 0; border-radius: 0; padding: 0; margin: 0; text-transform: none;
  letter-spacing: normal; line-height: inherit; cursor: pointer; box-shadow: none; text-align: inherit; white-space: normal;
}
.huny-root button:hover, .huny-root button:focus, .huny-root [type="button"]:hover, .huny-root [type="submit"]:hover { background: none; color: inherit; }
.huny-root button:disabled { cursor: not-allowed; opacity: .55; }
.huny-root :focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.huny-root input[type="text"], .huny-root input[type="email"], .huny-root input[type="password"], .huny-root textarea {
  font: inherit; color: var(--ink); background: #fff; border: 2px solid #CFCAC0; border-radius: 12px; padding: 11px 13px; width: 100%; box-shadow: none; margin: 0;
}
.huny-root input:focus, .huny-root textarea:focus { border-color: var(--ink); outline: none; }

/* Buttons */
.huny-root .hy-btn, .huny-root a.hy-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--honey); color: var(--ink);
  font-weight: 700; text-decoration: none; padding: 12px 24px; border-radius: 14px; border-bottom: 5px solid var(--honey-d);
  transition: transform .08s ease, filter .15s ease; min-height: 48px; text-align: center;
}
.huny-root .hy-btn:hover { filter: brightness(1.04); transform: translateY(-1px); color: var(--ink); background: var(--honey); }
.huny-root .hy-btn:active { transform: translateY(3px); border-bottom-width: 2px; }
.huny-root .hy-btn-ghost, .huny-root a.hy-btn-ghost { background: #fff; border: 2px solid var(--ink); border-bottom-width: 5px; }
.huny-root .hy-btn-ghost:hover { background: #fff; }
.huny-root .hy-btn-sm { padding: 7px 14px; min-height: 38px; font-size: 15px; border-bottom-width: 4px; }
.huny-root .hy-btn-lg { padding: 14px 32px; font-size: 18px; }
.huny-root .hy-mini { width: 32px; height: 32px; border-radius: 8px; background: var(--surface); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.huny-root .hy-mini:hover { background: var(--line); }

/* Bar */
.huny-root .hy-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 0; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin-bottom: 20px; }
.huny-root .hy-brand { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: var(--ink); }
.huny-root .hy-brand-t { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 22px; display: flex; align-items: baseline; gap: 6px; }
.huny-root .hy-brand-t small { font-family: 'Figtree', sans-serif; font-size: 12px; font-weight: 700; color: var(--ink2); }
.huny-root .hy-bar-r { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.huny-root .hy-chip { display: inline-flex; align-items: center; gap: 4px; padding: 6px 12px; border-radius: 999px; background: var(--honey-s); color: var(--honey-t); font-size: 14px; font-weight: 600; }
.huny-root .hy-chip-streak { background: #FFEDE6; color: #9A3412; }

/* Common */
.huny-root .hy-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.huny-root .hy-center { text-align: center; justify-content: center; }
.huny-root .hy-card { background: #fff; border: 2px solid var(--line); border-radius: 20px; padding: 22px; margin: 18px 0; }
.huny-root .hy-muted { color: var(--ink2); }
.huny-root .hy-small { font-size: 14px; }
.huny-root .hy-big { font-family: 'Bricolage Grotesque', sans-serif; font-size: 48px; font-weight: 800; margin: 0; }
.huny-root .hy-tag { display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: #ECE9E2; color: var(--ink2); white-space: nowrap; }
.huny-root .hy-tag-free { background: var(--leaf-s); color: var(--leaf-t); }
.huny-root .hy-tag-ok { background: var(--honey-s); color: var(--honey-t); }
.huny-root .hy-tag-gold { background: #FFE9A8; color: #7A5300; }
.huny-root .hy-banner { background: var(--honey-s); border: 2px solid #FFD699; border-radius: 14px; padding: 12px 16px; margin: 0 0 16px; font-weight: 600; }
.huny-root .hy-banner-ok { background: var(--leaf-s); border-color: #B9E0C8; color: var(--leaf-t); }
.huny-root .hy-note { background: var(--surface); border-radius: 12px; padding: 10px 14px; margin: 10px 0; font-size: 15px; }
.huny-root .hy-err { color: var(--red); font-weight: 600; min-height: 1.2em; }
.huny-root .hy-loading { display: flex; align-items: center; gap: 10px; padding: 40px 0; color: var(--ink2); justify-content: center; }
.huny-root .hy-spin { width: 22px; height: 22px; border: 3px solid var(--line); border-top-color: var(--honey); border-radius: 50%; animation: hySpin .8s linear infinite; display: inline-block; }
.huny-root .hy-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.huny-root .hy-crumbs { font-size: 14px; color: var(--ink2); margin-bottom: 10px; }
.huny-root .hy-crumbs a { color: var(--ink2); }
.huny-root .hy-progress { height: 12px; background: #ECE9E2; border-radius: 999px; overflow: hidden; margin: 10px 0; }
.huny-root .hy-progress > span { display: block; height: 100%; background: var(--leaf); border-radius: 999px; transition: width .6s cubic-bezier(.2,.8,.2,1); }
.huny-root .hy-progress-sm { height: 8px; flex: 1; margin: 0; }
.huny-root .hy-list { margin: .3em 0 .8em; padding-left: 1.2em; }
.huny-root .hy-list li { margin: .25em 0; }
.huny-root .hy-tablewrap { overflow-x: auto; margin: 10px 0; -webkit-overflow-scrolling: touch; }
.huny-root .hy-table { border-collapse: collapse; width: 100%; font-size: 15px; background: #fff; margin: 0; }
.huny-root .hy-table th, .huny-root .hy-table td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; vertical-align: top; }
.huny-root .hy-table th { background: var(--surface); font-weight: 600; }
body.hy-noscroll { overflow: hidden; }

/* Hexagons */
.huny-root .hy-hex { width: 48px; height: 55px; clip-path: var(--hex); background: var(--ink); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.huny-root .hy-hex-in { width: 42px; height: 48px; clip-path: var(--hex); background: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; }
.huny-root .hy-hex-sm { width: 34px; height: 39px; }
.huny-root .hy-hex-sm .hy-hex-in { width: 28px; height: 32px; font-size: 13px; }
.huny-root .hy-hex-gem .hy-hex-in { background: var(--honey); }

/* Home */
.huny-root .hy-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #FFFCF5; border-radius: 24px; padding: 26px; margin-bottom: 24px; position: relative; overflow: hidden; }
.huny-root .hy-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .25;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='96'%3E%3Cpath d='M28 0L56 16V48L28 64L0 48V16Z' fill='none' stroke='%23FF9F1A' stroke-width='1.3'/%3E%3C/svg%3E");
  -webkit-mask-image: linear-gradient(90deg, transparent 30%, #000); mask-image: linear-gradient(90deg, transparent 30%, #000); }
.huny-root .hy-hero-t { position: relative; z-index: 1; max-width: 640px; }
.huny-root .hy-hero-m { position: relative; z-index: 1; }
.huny-root .hy-path { margin: 26px 0; }
.huny-root .hy-comb { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.huny-root .hy-hexcell { display: block; text-decoration: none; color: var(--ink); background: var(--ink); clip-path: var(--hex); aspect-ratio: 200 / 230; padding: 4px; transition: transform .2s cubic-bezier(.34,1.56,.64,1); }
.huny-root .hy-hexcell:hover { transform: translateY(-4px); color: var(--ink); }
.huny-root .hy-hexcell.hy-has { background: var(--honey); }
.huny-root .hy-hexcell-in { width: 100%; height: 100%; clip-path: var(--hex); background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 0 18%; text-align: center; }
.huny-root .hy-hexcell-t { font-weight: 800; font-size: 15px; line-height: 1.2; }
.huny-root .hy-hexcell-m { font-size: 12px; color: var(--ink2); }

/* Career */
.huny-root .hy-career-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 10px; }
.huny-root .hy-career-head > div { flex: 1 1 320px; }
.huny-root .hy-branch { border: 2px solid var(--line); border-radius: 20px; padding: 16px 18px; margin: 14px 0; background: #fff; }
.huny-root .hy-branch.hy-golden { border-color: #E8C877; background: #FFFBEF; }
.huny-root .hy-branch-h { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.huny-root .hy-branch-h h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 20px; }
.huny-root .hy-branch-n { width: 32px; height: 37px; clip-path: var(--hex); background: var(--ink); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; }
.huny-root .hy-leaves { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.huny-root .hy-leaf { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); padding: 8px 10px; border-radius: 14px; width: 100%; }
.huny-root a.hy-leaf:hover, .huny-root button.hy-leaf:hover { background: var(--surface); color: var(--ink); }
.huny-root .hy-leaf-t { flex: 1; font-weight: 600; font-size: 15px; line-height: 1.25; }
.huny-root .hy-leaf-m { font-size: 12px; color: var(--honey-t); font-weight: 700; white-space: nowrap; }
.huny-root .hy-leaf-done .hy-hex { background: var(--leaf); }
.huny-root .hy-leaf-done .hy-hex-in { background: var(--leaf); color: #fff; }
.huny-root .hy-leaf-open .hy-hex { background: var(--honey); }
.huny-root .hy-leaf-locked, .huny-root .hy-leaf-waiting { opacity: .55; }
.huny-root .hy-leaf-locked .hy-hex, .huny-root .hy-leaf-waiting .hy-hex { background: #A9A59B; }
.huny-root .hy-leaf-exam .hy-hex-in { color: var(--honey-d); }
.huny-root .hy-exam-card { background: #14162B; color: #fff; border: 0; }
.huny-root .hy-exam-card h2, .huny-root .hy-exam-card p { color: #fff; }

/* Lesson */
.huny-root .hy-lesson-top { display: flex; align-items: center; gap: 12px; margin: 6px 0 12px; }
.huny-root .hy-lesson { background: #fff; border: 2px solid var(--line); border-radius: 24px; padding: 22px; }
.huny-root .hy-lesson-exam { border-color: #E8C877; }
.huny-root .hy-lesson-h { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; }
.huny-root .hy-lesson-h h1 { font-size: clamp(22px, 3.2vw, 30px); margin: 0; }
.huny-root .hy-eng { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--honey-t); }
.huny-root .hy-prompt { font-size: 18px; font-weight: 600; }
.huny-root .hy-context { background: var(--surface); border-left: 4px solid var(--honey); border-radius: 8px; padding: 10px 14px; margin: 0 0 14px; }
.huny-root .hy-howto { font-size: 14px; color: var(--ink2); }
.huny-root .hy-actions { display: flex; gap: 10px; align-items: center; justify-content: flex-end; flex-wrap: wrap; margin-top: 18px; }
.huny-root .hy-hint { display: flex; gap: 8px; align-items: center; background: #EEF4FF; border-radius: 12px; padding: 8px 12px; margin-right: auto; }
.huny-root .hy-shake { animation: hyShake .4s; }

.huny-root .hy-options { display: grid; gap: 10px; }
.huny-root .hy-opt, .huny-root .hy-card-btn, .huny-root .hy-line, .huny-root .hy-zone {
  display: block; width: 100%; background: #fff; border: 2px solid #D6D2C8; border-bottom-width: 4px; border-radius: 14px; padding: 12px 14px; text-align: left; transition: border-color .15s, background .15s;
}
.huny-root .hy-opt:hover, .huny-root .hy-card-btn:hover, .huny-root .hy-line:hover { border-color: var(--ink); background: #fff; }
.huny-root .hy-sel { border-color: var(--ink) !important; background: var(--honey-s) !important; }
.huny-root .hy-good { border-color: var(--leaf) !important; background: var(--leaf-s) !important; }
.huny-root .hy-bad { border-color: var(--red) !important; background: var(--red-s) !important; }

.huny-root .hy-match { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.huny-root .hy-col { display: grid; gap: 8px; align-content: start; }
.huny-root .hy-card-btn { position: relative; padding-left: 40px; font-size: 15px; }
.huny-root .hy-badge { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 22px; height: 25px; clip-path: var(--hex); background: var(--pc, transparent); color: #fff; font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.huny-root .hy-card-btn:not(.hy-paired) .hy-badge { background: #E4E1D9; }
.huny-root .hy-paired { border-color: var(--pc) !important; }

.huny-root .hy-pool { display: flex; flex-wrap: wrap; gap: 8px; min-height: 48px; padding: 10px; background: var(--surface); border-radius: 14px; margin: 8px 0 12px; }
.huny-root .hy-chipitem { display: inline-block; background: #fff; border: 2px solid #D6D2C8; border-bottom-width: 4px; border-radius: 12px; padding: 7px 12px; font-size: 15px; cursor: pointer; text-align: left; }
.huny-root .hy-chipitem:hover { border-color: var(--ink); }
.huny-root .hy-buckets { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.huny-root .hy-zone { min-height: 110px; border-style: dashed; border-bottom-width: 2px; cursor: default; }
.huny-root .hy-armed .hy-zone { cursor: pointer; border-color: var(--honey); background: #FFFCF5; }
.huny-root .hy-zone-l { display: block; font-weight: 800; margin-bottom: 8px; }
.huny-root .hy-zone-items { display: flex; flex-wrap: wrap; gap: 6px; }

.huny-root .hy-doc { background: #FFFEFA; border: 1px solid var(--line); border-radius: 12px; padding: 14px; box-shadow: 0 2px 0 var(--line); }
.huny-root .hy-doc-t { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; margin-bottom: 8px; }
.huny-root .hy-line { border-width: 0 0 0 4px; border-color: transparent; border-radius: 0; padding: 8px 10px; margin: 2px 0; }
.huny-root .hy-line:hover { border-color: var(--line); background: var(--surface); }
.huny-root .hy-line.hy-marked { border-color: var(--red); background: var(--red-s); text-decoration: underline wavy var(--red); text-decoration-thickness: 1px; }

.huny-root .hy-route, .huny-root .hy-build { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.huny-root .hy-step { display: flex; align-items: center; gap: 10px; border: 2px solid #D6D2C8; border-radius: 14px; padding: 8px 10px; background: #fff; min-height: 52px; }
.huny-root .hy-step-empty { border-style: dashed; background: var(--surface); }
.huny-root .hy-step-end { border: 0; background: none; font-weight: 700; padding-left: 0; }
.huny-root .hy-step-n { width: 28px; height: 32px; clip-path: var(--hex); background: var(--ink); color: #fff; font-size: 13px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.huny-root .hy-step-t { flex: 1; }
.huny-root .hy-step-ctl { display: inline-flex; gap: 4px; }
.huny-root .hy-walk .hy-step-on { animation: hyWalk .5s ease both; }
.huny-root .hy-walk .hy-step-on:nth-child(3) { animation-delay: .15s; } .huny-root .hy-walk .hy-step-on:nth-child(4) { animation-delay: .3s; } .huny-root .hy-walk .hy-step-on:nth-child(5) { animation-delay: .45s; }

.huny-root .hy-slider { background: var(--surface); border-radius: 16px; padding: 16px; margin-top: 10px; }
.huny-root .hy-slider-v { display: flex; align-items: center; gap: 8px; justify-content: center; margin-bottom: 10px; }
.huny-root .hy-slider-v input.hy-num { width: 180px; text-align: center; font-size: 22px; font-weight: 800; }
.huny-root .hy-unit { font-weight: 700; color: var(--ink2); }
.huny-root .hy-range { width: 100%; accent-color: var(--honey); height: 32px; }
.huny-root .hy-slider-ends { display: flex; justify-content: space-between; font-size: 13px; color: var(--ink2); }
.huny-root .hy-dir { font-weight: 700; color: var(--red); margin-top: 6px; min-height: 1.2em; }

.huny-root .hy-ledger th { width: 60%; font-weight: 500; background: #fff; }
.huny-root .hy-ledger tr.hy-blank th { font-weight: 700; background: var(--honey-s); }
.huny-root input.hy-cell { max-width: 200px; text-align: right; font-weight: 700; padding: 8px 10px; }
.huny-root .hy-given { font-variant-numeric: tabular-nums; }
.huny-root .hy-rules summary, .huny-root .hy-more summary { cursor: pointer; font-weight: 700; padding: 6px 0; }

/* Result sheet */
.huny-root .hy-sheet { margin-top: 0; }
.huny-root .hy-sheet-ok, .huny-root .hy-sheet-bad { margin-top: 18px; border-radius: 20px; padding: 18px; animation: hySheet .35s cubic-bezier(.2,.8,.2,1); }
.huny-root .hy-sheet-ok { background: var(--leaf-s); border: 2px solid #B9E0C8; }
.huny-root .hy-sheet-bad { background: var(--red-s); border: 2px solid #F3C1BC; }
.huny-root .hy-sheet-h { display: flex; gap: 12px; align-items: flex-start; }
.huny-root .hy-sheet-h h2 { margin: 0 0 4px; }
.huny-root .hy-xp-pop { display: inline-block; background: var(--honey); color: var(--ink); font-weight: 800; padding: 4px 12px; border-radius: 999px; animation: hyPop .5s cubic-bezier(.34,1.56,.64,1); }
.huny-root .hy-cons { font-style: italic; }
.huny-root .hy-review { background: #fff; border-radius: 14px; padding: 4px 16px 10px; margin-top: 12px; }

/* Passes / modal */
.huny-root .hy-modal { position: fixed; inset: 0; background: rgba(20,22,43,.55); z-index: 99999; display: flex; align-items: flex-end; justify-content: center; padding: 0; }
.huny-root .hy-modal-c { background: #fff; width: 100%; max-width: 620px; max-height: 92vh; overflow: auto; border-radius: 24px 24px 0 0; padding: 26px 20px 30px; position: relative; animation: hySheet .3s cubic-bezier(.2,.8,.2,1); }
@media (min-width: 700px) { .huny-root .hy-modal { align-items: center; } .huny-root .hy-modal-c { border-radius: 24px; } }
.huny-root .hy-x { position: absolute; right: 14px; top: 10px; font-size: 30px; line-height: 1; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.huny-root .hy-x:hover { background: var(--surface); }
.huny-root .hy-passes { display: grid; gap: 10px; margin: 14px 0; }
.huny-root .hy-pass { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; align-items: center; border: 2px solid var(--line); border-radius: 16px; padding: 12px 14px; }
.huny-root .hy-pass-best { border-color: var(--honey); background: #FFFCF5; }
.huny-root .hy-pass-p { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 22px; }
.huny-root .hy-paybtns { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }

/* Account / auth */
.huny-root .hy-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.huny-root .hy-stat { background: var(--honey-s); border-radius: 18px; padding: 14px; text-align: center; clip-path: none; }
.huny-root .hy-stat b { display: block; font-family: 'Bricolage Grotesque', sans-serif; font-size: 30px; }
.huny-root .hy-stat span { font-size: 13px; color: var(--ink2); }
.huny-root .hy-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.huny-root .hy-form-row label { font-size: 14px; font-weight: 600; display: grid; gap: 4px; }
.huny-root .hy-auth { max-width: 440px; margin: 10px auto; background: #fff; border: 2px solid var(--line); border-radius: 24px; padding: 26px 22px; display: grid; gap: 12px; text-align: center; }
.huny-root .hy-field { display: grid; gap: 4px; text-align: left; font-weight: 600; font-size: 14px; position: relative; }
.huny-root .hy-showpw { position: absolute; right: 10px; bottom: 10px; font-size: 13px; font-weight: 700; color: var(--blue); padding: 4px 6px; }
.huny-root .hy-check { display: flex; gap: 8px; align-items: center; justify-content: flex-start; font-size: 14px; }
.huny-root .hy-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.huny-root .hy-caption { width: 100%; }
.huny-root .hy-sh-opts { display: grid; gap: 8px; margin: 12px 0; }
.huny-root .hy-sh-opt { text-align: left; font: inherit; font-size: 15px; line-height: 1.4; padding: 10px 14px; border: 2px solid var(--line, #dcdcd2); border-radius: 14px; background: #fff; color: inherit; cursor: pointer; }
.huny-root .hy-sh-opt:hover { border-color: #14162B; }
.huny-root .hy-sh-opt.on { border-color: #14162B; background: #FFF4DC; font-weight: 600; }
.huny-root .hy-sh-own { color: #5b6070; border-style: dashed; }
.huny-root .hy-btn[disabled] { opacity: .6; cursor: progress; }

/* Certificate: fixed A4-landscape picture that scales as one piece */
.huny-root .hy-cert-wrap { max-width: 1000px; margin: 10px auto 18px; }
.huny-root .hy-cert { display: block; width: 100%; height: auto; filter: drop-shadow(0 2px 3px rgba(20,22,43,.10)) drop-shadow(0 18px 28px rgba(20,22,43,.16)); }

/* Mascot */
.huny-root .hy-huny-wrap { display: inline-flex; flex: none; }
.huny-root .hy-huny .hy-wl, .huny-root .hy-huny .hy-wr { transform-box: fill-box; transform-origin: bottom center; animation: hyFlap 3.2s ease-in-out infinite; }
.huny-root .hy-huny .hy-wr { animation-name: hyFlapR; }
.huny-root .hy-huny .hy-blink { transform-box: fill-box; transform-origin: center; animation: hyBlink 4.5s infinite; }
.huny-root .hy-pose-happy { animation: hyHop 1.2s ease-in-out 2; }

@keyframes hySpin { to { transform: rotate(360deg); } }
@keyframes hyShake { 0%, 100% { transform: none; } 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
@keyframes hySheet { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes hyPop { 0% { transform: scale(.6); opacity: 0; } 70% { transform: scale(1.1); opacity: 1; } 100% { transform: scale(1); } }
@keyframes hyWalk { 0% { background: #fff; } 50% { background: var(--leaf-s); border-color: var(--leaf); } 100% { background: var(--leaf-s); border-color: var(--leaf); } }
@keyframes hyFlap { 0%, 70%, 100% { transform: rotate(0); } 80% { transform: rotate(-12deg); } 90% { transform: rotate(2deg); } }
@keyframes hyFlapR { 0%, 70%, 100% { transform: rotate(0); } 80% { transform: rotate(12deg); } 90% { transform: rotate(-2deg); } }
@keyframes hyBlink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes hyHop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

@media (max-width: 640px) {
  .huny-root { font-size: 16px; padding: 0 12px 40px; }
  .huny-root .hy-hero { flex-direction: column-reverse; text-align: center; padding: 20px; }
  .huny-root .hy-comb { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .huny-root .hy-hexcell-in { padding: 0 14%; }
  .huny-root .hy-hexcell-t { font-size: 13px; }
  .huny-root .hy-hexcell-m { display: none; }
  .huny-root .hy-match { grid-template-columns: 1fr; }
  .huny-root .hy-match .hy-col + .hy-col { border-top: 2px dashed var(--line); padding-top: 12px; }
  .huny-root .hy-lesson { padding: 16px; border-radius: 18px; }
  .huny-root .hy-actions .hy-btn-lg { width: 100%; }
  .huny-root .hy-form-row { grid-template-columns: 1fr; }
  .huny-root .hy-stats { gap: 6px; }
  .huny-root .hy-chip-streak { display: none; }
}
@media (prefers-reduced-motion: reduce) { .huny-root *, .huny-root *::before, .huny-root *::after { animation: none !important; transition: none !important; } }

/* ---------------------------------------------------------- Journey v2 */
/* Progress dots (onboarding + lesson player) */
.huny-root .hy-dots { display: flex; gap: 6px; align-items: center; flex: 1; }
.huny-root .hy-dot { flex: 1; max-width: 56px; height: 8px; border-radius: 999px; background: #ECE9E2; transition: background .3s; }
.huny-root .hy-dot-done { background: var(--leaf); }
.huny-root .hy-dot-on { background: var(--honey); }
.huny-root .hy-eyebrow { display: block; font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--honey-t); margin-bottom: 4px; }
.huny-root .hy-sec-t { margin-top: 28px; }

/* Onboarding */
.huny-root .hy-onb { max-width: 680px; margin: 8px auto 0; }
.huny-root .hy-onb-top { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.huny-root .hy-back, .huny-root a.hy-back { font-weight: 700; color: var(--ink2); text-decoration: none; white-space: nowrap; padding: 6px 2px; }
.huny-root .hy-onb-q { text-align: center; }
.huny-root .hy-onb-q h1 { margin-top: 6px; }
.huny-root .hy-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 18px 0; text-align: left; }
.huny-root .hy-chips-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); text-align: center; }
.huny-root .hy-bigopt { display: block; width: 100%; min-height: 58px; background: #fff; border: 2px solid #D6D2C8; border-bottom-width: 5px; border-radius: 16px; padding: 14px 16px; font-weight: 700; font-size: 17px; transition: border-color .15s, transform .08s; }
.huny-root .hy-bigopt:hover { border-color: var(--ink); background: #fff; }
.huny-root .hy-bigopt:active { transform: translateY(2px); }
.huny-root .hy-chips-4 .hy-bigopt b { display: block; font-size: 28px; font-family: 'Bricolage Grotesque', 'Figtree', sans-serif; }
.huny-root .hy-onb-res { font-weight: 700; font-size: 18px; min-height: 1.5em; color: var(--leaf-t); }
.huny-root .hy-select { font: inherit; width: 100%; color: var(--ink); background: #fff; border: 2px solid #CFCAC0; border-radius: 12px; padding: 12px 13px; margin-top: 6px; }
.huny-root .hy-select:focus { border-color: var(--ink); outline: none; }
.huny-root .hy-onb .hy-field { text-align: left; display: block; max-width: 420px; margin: 18px auto 0; font-weight: 600; }
.huny-root .hy-onb .hy-actions { justify-content: center; }
.huny-root .hy-go { max-width: 640px; margin: 18px auto; padding: 32px 22px; }
.huny-root .hy-go .hy-btn-lg { margin: 10px 0 6px; }
.huny-root .hy-go-why { font-size: 18px; }

/* Home: Continue card, goal ring */
.huny-root .hy-home-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.huny-root .hy-home-h h1 { margin: 0; }
.huny-root .hy-continue { display: flex; gap: 18px; align-items: center; background: #FFFCF5; border: 2px solid #FFD699; border-radius: 24px; padding: 22px; margin: 6px 0 18px; }
.huny-root .hy-continue-t { flex: 1; min-width: 0; }
.huny-root .hy-continue-t h2 { margin: 0 0 4px; }
.huny-root .hy-continue .hy-row { margin-top: 10px; }
.huny-root .hy-continue-btn { max-width: 100%; }
.huny-root .hy-goal { display: flex; align-items: center; gap: 10px; }
.huny-root .hy-goal-ring { --p: 0; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--leaf) calc(var(--p) * 1%), #ECE9E2 0); }
.huny-root .hy-goal-ring span { width: 34px; height: 34px; border-radius: 50%; background: #fff; display: grid; place-items: center; font-weight: 800; }
.huny-root .hy-chip-streak2 { background: #FFF0E0; }
.huny-root .hy-explore { margin: 26px 0; }
.huny-root .hy-explore > summary { cursor: pointer; font-family: 'Bricolage Grotesque', 'Figtree', sans-serif; font-weight: 800; font-size: 20px; padding: 12px 0; }
.huny-root .hy-soft { border-color: #FFD699; background: #FFFCF5; }
.huny-root .hy-soft-t { flex: 1; min-width: 0; }
.huny-root .hy-save { padding: 6px 0; }
.huny-root .hy-save .hy-row { margin: 8px 0; }

/* Lesson player: teaching screens */
.huny-root .hy-lesson-top .hy-dots-lesson { max-width: none; }
.huny-root .hy-teach { min-height: 300px; display: flex; flex-direction: column; animation: hySheet .3s cubic-bezier(.2,.8,.2,1); }
.huny-root .hy-teach > .hy-actions { margin-top: auto; padding-top: 18px; }
.huny-root .hy-teach-h { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.huny-root .hy-teach-h h1, .huny-root .hy-teach-h h2 { margin: 0; }
.huny-root .hy-teach-hook { font-family: 'Bricolage Grotesque', 'Figtree', sans-serif; font-size: clamp(22px, 3vw, 28px); font-weight: 700; line-height: 1.3; margin: 12px 0; }
.huny-root .hy-teach-big { font-size: 19px; line-height: 1.55; }
.huny-root .hy-worked { margin: 8px 0 14px; padding: 0; list-style: none; counter-reset: wk; display: grid; gap: 8px; }
.huny-root .hy-worked li { counter-increment: wk; position: relative; background: var(--surface); border-radius: 12px; padding: 10px 14px 10px 48px; }
.huny-root .hy-worked li::before { content: counter(wk); position: absolute; left: 12px; top: 10px; width: 24px; height: 27px; clip-path: var(--hex); background: var(--honey); font-weight: 800; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.huny-root .hy-takeaway { border-left: 5px solid var(--leaf); background: var(--leaf-s); border-radius: 0 12px 12px 0; padding: 10px 14px; font-weight: 700; }
.huny-root .hy-opt-big { display: flex; gap: 12px; align-items: center; min-height: 58px; font-size: 17px; }
.huny-root .hy-opt-k { flex: none; width: 30px; height: 34px; clip-path: var(--hex); background: #ECE9E2; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; }
.huny-root .hy-opt-big.hy-good .hy-opt-k { background: var(--leaf); color: #fff; }
.huny-root .hy-opt-big.hy-bad .hy-opt-k { background: var(--red); color: #fff; }
.huny-root .hy-opt-big:disabled { opacity: 1; cursor: default; }
.huny-root .hy-recap .hy-row { margin: 10px 0; }
.huny-root .hy-recap .hy-actions { justify-content: center; }
.huny-root .hy-mastery { margin-top: 18px; background: #FFF8E6; border: 2px solid #F2D58A; border-radius: 16px; padding: 14px 16px; }
.huny-root .hy-mastery .hy-actions { margin-top: 8px; }
.huny-root .hy-freeend .hy-fe-t { display: block; margin-top: 4px; }
.huny-root .hy-moreopts { margin-top: 12px; }
@media (max-width: 640px) {
  .huny-root .hy-chips { grid-template-columns: 1fr; }
  .huny-root .hy-chips-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .huny-root .hy-continue { flex-direction: column; align-items: stretch; text-align: left; padding: 18px; }
  .huny-root .hy-continue-m { display: none; }
  .huny-root .hy-continue .hy-btn-lg, .huny-root .hy-go .hy-btn-lg { width: 100%; }
  .huny-root .hy-teach { min-height: 0; }
  .huny-root .hy-teach-big { font-size: 17px; }
}
/* ============================================================ 1.2: courses, player order, Huny alive */

/* ---------- Bar */
.huny-root .hy-bar { gap: 10px 16px; }
.huny-root .hy-nav { display: flex; gap: 4px; margin-right: auto; }
.huny-root .hy-navlink { text-decoration: none; color: var(--ink2); font-weight: 700; padding: 8px 12px; border-radius: 10px; }
.huny-root .hy-navlink:hover { background: var(--surface); color: var(--ink); }
.huny-root .hy-navlink.on { color: var(--ink); background: var(--honey-s); }
.huny-root .hy-chip-lvl { background: #EEF4FF; color: #123E8F; gap: 6px; padding-left: 5px; }
.huny-root .hy-ring { --p: 0; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--blue) calc(var(--p) * 1%), #CFE0FF 0); }
.huny-root .hy-ring span { width: 19px; height: 19px; border-radius: 50%; background: #fff; display: grid; place-items: center; font-weight: 800; font-size: 12px; color: var(--ink); }
.huny-root .hy-energy { gap: 6px; background: #FFF7D6; color: #7A5300; }
.huny-root .hy-drops { display: inline-flex; gap: 3px; }
.huny-root .hy-drops i { width: 11px; height: 13px; clip-path: var(--hex); background: #E9DFC0; }
.huny-root .hy-drops i.on { background: var(--honey); animation: hyGlow 2.4s ease-in-out infinite; }
.huny-root .hy-energy.hy-empty { background: #F1EEE7; color: var(--ink2); }
.huny-root .hy-flame { display: inline-block; transform-origin: 50% 90%; animation: hyFlame 1.1s ease-in-out infinite; }
.huny-root .hy-bump { animation: hyBump .5s cubic-bezier(.34,1.56,.64,1); }
.huny-root .hy-main.hy-enter { animation: hyEnter .35s cubic-bezier(.2,.8,.2,1); }
@keyframes hyGlow { 0%, 100% { filter: none; } 50% { filter: brightness(1.15) drop-shadow(0 0 3px #FFC53D); } }
@keyframes hyFlame { 0%, 100% { transform: scale(1) rotate(-4deg); } 50% { transform: scale(1.15, 1.22) rotate(5deg); } }
@keyframes hyBump { 0% { transform: scale(1); } 40% { transform: scale(1.35); background: var(--honey); color: var(--ink); } 100% { transform: scale(1); } }
@keyframes hyEnter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ---------- Huny the bee (every part moves) */
.huny-root .hy-huny-wrap { display: inline-flex; flex: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.huny-root .hy-bee { overflow: visible; }
.huny-root .hy-bee g { transform-box: view-box; }
.huny-root .hy-bee .b-root { transform-origin: 100px 120px; animation: bBob 2.6s ease-in-out infinite; }
.huny-root .hy-bee .b-shadow { transform-origin: 100px 188px; animation: bShadow 2.6s ease-in-out infinite; }
.huny-root .hy-bee .b-wl { transform-origin: 88px 80px; animation: bFlapL .9s ease-in-out infinite; }
.huny-root .hy-bee .b-wr { transform-origin: 112px 80px; animation: bFlapR .9s ease-in-out infinite; }
.huny-root .hy-bee .b-al { transform-origin: 90px 72px; animation: bAntL 2.2s ease-in-out infinite; }
.huny-root .hy-bee .b-ar { transform-origin: 110px 72px; animation: bAntR 2.2s ease-in-out infinite .3s; }
.huny-root .hy-bee .b-arml { transform-origin: 50px 124px; }
.huny-root .hy-bee .b-armr { transform-origin: 150px 124px; }
.huny-root .hy-bee .b-eye { transform-box: fill-box; transform-origin: center; animation: bBlink 4.6s infinite; }
.huny-root .hy-bee .b-eye + .b-eye { animation-delay: .04s; }
.huny-root .hy-bee .b-pupil { transform: translate(calc(var(--lx, 0) * 3.5px), calc(var(--ly, 0) * 3px)); transition: transform .25s ease-out; }
.huny-root .hy-bee .b-face { transform-origin: 100px 110px; transform: translate(calc(var(--lx, 0) * 2px), calc(var(--ly, 0) * 1.5px)); transition: transform .3s ease-out; }
.huny-root .hy-bee .b-cheek { animation: bBlush 3s ease-in-out infinite; }
/* moods */
.huny-root .hy-bee--wave .b-armr { animation: bWave 1.4s ease-in-out infinite; }
.huny-root .hy-bee--happy .b-root { animation: bHop 1s cubic-bezier(.3,.7,.4,1) infinite; }
.huny-root .hy-bee--happy .b-arml { transform: rotate(18deg); } .huny-root .hy-bee--happy .b-armr { transform: rotate(-18deg); }
.huny-root .hy-bee--cheer .b-root { animation: bCheer .8s cubic-bezier(.3,.7,.4,1) infinite; }
.huny-root .hy-bee--cheer .b-wl, .huny-root .hy-bee--fly .b-wl { animation: bFlapL .11s linear infinite; }
.huny-root .hy-bee--cheer .b-wr, .huny-root .hy-bee--fly .b-wr { animation: bFlapR .11s linear infinite; }
.huny-root .hy-bee--cheer .b-arml { animation: bArmUpL .4s ease-in-out infinite alternate; }
.huny-root .hy-bee--cheer .b-armr { animation: bArmUpR .4s ease-in-out infinite alternate; }
.huny-root .hy-bee .b-spark path { transform-box: fill-box; transform-origin: center; animation: bSpark 1.2s ease-in-out infinite; }
.huny-root .hy-bee .b-spark .s1 { animation-delay: .3s; } .huny-root .hy-bee .b-spark .s2 { animation-delay: .6s; } .huny-root .hy-bee .b-spark .s3 { animation-delay: .9s; }
.huny-root .hy-bee--think .b-root { animation: bThink 3s ease-in-out infinite; }
.huny-root .hy-bee--think .b-armr { transform: rotate(-120deg); }
.huny-root .hy-bee .b-q { transform-origin: 160px 44px; animation: bQ 1.6s ease-in-out infinite; }
.huny-root .hy-bee--sad .b-root { animation: bSad 3.4s ease-in-out infinite; }
.huny-root .hy-bee--sad .b-al { animation: none; transform: rotate(-38deg); } .huny-root .hy-bee--sad .b-ar { animation: none; transform: rotate(38deg); }
.huny-root .hy-bee--sad .b-wl, .huny-root .hy-bee--sad .b-wr { animation-duration: 2.6s; }
.huny-root .hy-bee--sad .b-arml { transform: rotate(-12deg); } .huny-root .hy-bee--sad .b-armr { transform: rotate(12deg); }
.huny-root .hy-bee .b-tear { animation: bTear 1.6s ease-in infinite; }
.huny-root .hy-bee--settle .b-root { animation: bNod 3.4s ease-in-out forwards; }
.huny-root .hy-bee--settle .b-wl { animation: bWingSetL 3s ease-out forwards; } .huny-root .hy-bee--settle .b-wr { animation: bWingSetR 3s ease-out forwards; }
.huny-root .hy-bee--settle .b-al { animation: bAntSet 2.8s ease-in-out forwards; } .huny-root .hy-bee--settle .b-ar { animation: bAntSetR 2.8s ease-in-out forwards; }
.huny-root .hy-bee--settle .b-open { transform-box: fill-box; transform-origin: 50% 55%; animation: bLids 3.4s ease-in-out forwards; }
.huny-root .hy-bee--settle .b-eye { animation: none; }
.huny-root .hy-bee--settle .b-shut { opacity: 0; animation: bShut 3.4s linear forwards; }
.huny-root .hy-bee--settle .b-sm { animation: bSmileOut 3.4s linear forwards; }
.huny-root .hy-bee--settle .b-sn { opacity: 0; transform-box: fill-box; transform-origin: center; animation: bSnIn 3.4s linear forwards; }
.huny-root .hy-bee--sleep .b-root { animation: bBreathe 3.2s ease-in-out infinite; }
.huny-root .hy-bee--sleep .b-wl, .huny-root .hy-bee--sleep .b-wr { animation: none; }
.huny-root .hy-bee--sleep .b-al { animation: none; transform: rotate(-22deg); } .huny-root .hy-bee--sleep .b-ar { animation: none; transform: rotate(22deg); }
.huny-root .hy-bee--sleep .b-snore { transform-box: fill-box; transform-origin: center; animation: bSnore 3.2s ease-in-out infinite; }
.huny-root .hy-bee .b-z text { animation: bZ 3s ease-in infinite; opacity: 0; }
.huny-root .hy-bee .b-z .z2 { animation-delay: 1s; } .huny-root .hy-bee .b-z .z3 { animation-delay: 2s; }
.huny-root .hy-bee--wow .b-root { animation: bWow .6s cubic-bezier(.34,1.56,.64,1) 1, bBob 2.6s ease-in-out .6s infinite; }
.huny-root .hy-bee--fly .b-root { animation: bFly 2.4s ease-in-out infinite; }
.huny-root .hy-bee--fly .b-shadow { animation: bFlyShadow 2.4s ease-in-out infinite; }
.huny-root .hy-tickle .b-root { animation: bTickle .7s cubic-bezier(.34,1.56,.64,1) 1 !important; }
@keyframes bBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes bShadow { 0%, 100% { transform: scaleX(1); opacity: .12; } 50% { transform: scaleX(.85); opacity: .07; } }
@keyframes bFlapL { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-24deg); } }
@keyframes bFlapR { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(24deg); } }
@keyframes bAntL { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-12deg); } }
@keyframes bAntR { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(12deg); } }
@keyframes bBlink { 0%, 91%, 100% { transform: scaleY(1); } 94% { transform: scaleY(.08); } }
@keyframes bBlush { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }
@keyframes bWave { 0%, 60%, 100% { transform: rotate(0); } 15% { transform: rotate(-150deg); } 30% { transform: rotate(-110deg); } 45% { transform: rotate(-150deg); } }
@keyframes bHop { 0%, 100% { transform: translateY(0) scale(1, 1); } 15% { transform: translateY(0) scale(1.06, .94); } 45% { transform: translateY(-16px) scale(.96, 1.05); } 75% { transform: translateY(0) scale(1.04, .96); } }
@keyframes bCheer { 0%, 100% { transform: translateY(0) rotate(0) scale(1.05, .95); } 40% { transform: translateY(-24px) rotate(-6deg) scale(.95, 1.06); } 60% { transform: translateY(-22px) rotate(6deg); } }
@keyframes bArmUpL { from { transform: rotate(90deg); } to { transform: rotate(140deg); } }
@keyframes bArmUpR { from { transform: rotate(-90deg); } to { transform: rotate(-140deg); } }
@keyframes bSpark { 0%, 100% { transform: scale(0) rotate(0); opacity: 0; } 50% { transform: scale(1.2) rotate(45deg); opacity: 1; } }
@keyframes bThink { 0%, 100% { transform: rotate(-6deg) translateY(0); } 50% { transform: rotate(-9deg) translateY(-3px); } }
@keyframes bQ { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-6px) scale(1.08); } }
@keyframes bSad { 0%, 100% { transform: translateY(6px) rotate(-3deg) scale(1, .97); } 50% { transform: translateY(8px) rotate(-1deg) scale(1.02, .95); } }
@keyframes bTear { 0% { transform: translateY(0); opacity: 0; } 15% { opacity: 1; } 100% { transform: translateY(26px); opacity: 0; } }
@keyframes bNod { 0% { transform: translate(0, 0) rotate(0); } 18% { transform: translate(0, 2px) rotate(5deg); } 32% { transform: translate(0, 0) rotate(-1deg); } 52% { transform: translate(0, 3px) rotate(8deg); } 66% { transform: translate(0, 1px) rotate(1deg); } 84% { transform: translate(0, 4px) rotate(3deg); } 100% { transform: translate(0, 4px) rotate(0); } }
@keyframes bWingSetL { 0% { transform: rotate(-24deg); } 14% { transform: rotate(2deg); } 28% { transform: rotate(-18deg); } 42% { transform: rotate(2deg); } 58% { transform: rotate(-9deg); } 76% { transform: rotate(1deg); } 100% { transform: rotate(0); } }
@keyframes bWingSetR { 0% { transform: rotate(24deg); } 14% { transform: rotate(-2deg); } 28% { transform: rotate(18deg); } 42% { transform: rotate(-2deg); } 58% { transform: rotate(9deg); } 76% { transform: rotate(-1deg); } 100% { transform: rotate(0); } }
@keyframes bAntSet { 0% { transform: rotate(0); } 100% { transform: rotate(-22deg); } }
@keyframes bAntSetR { 0% { transform: rotate(0); } 100% { transform: rotate(22deg); } }
@keyframes bLids { 0%, 14% { transform: scaleY(1); opacity: 1; } 30% { transform: scaleY(.45); } 40% { transform: scaleY(.9); } 58% { transform: scaleY(.3); } 66% { transform: scaleY(.7); } 84% { transform: scaleY(.1); opacity: 1; } 90%, 100% { transform: scaleY(.05); opacity: 0; } }
@keyframes bShut { 0%, 82% { opacity: 0; } 92%, 100% { opacity: 1; } }
@keyframes bSmileOut { 0%, 70% { opacity: 1; } 88%, 100% { opacity: 0; } }
@keyframes bSnIn { 0%, 78% { opacity: 0; transform: scale(.2); } 100% { opacity: 1; transform: scale(.7); } }
@keyframes bBreathe { 0%, 100% { transform: translateY(4px) scale(1, 1); } 50% { transform: translateY(2px) scale(1.04, .97); } }
@keyframes bSnore { 0%, 100% { transform: scale(.7); } 50% { transform: scale(1.3); } }
@keyframes bZ { 0% { transform: translate(0, 10px); opacity: 0; } 25% { opacity: 1; } 100% { transform: translate(14px, -26px); opacity: 0; } }
@keyframes bWow { 0% { transform: scale(.7); } 60% { transform: scale(1.15); } 100% { transform: scale(1); } }
@keyframes bFly { 0%, 100% { transform: translate(0, 0) rotate(-4deg); } 25% { transform: translate(8px, -10px) rotate(4deg); } 50% { transform: translate(0, -16px) rotate(-2deg); } 75% { transform: translate(-8px, -8px) rotate(5deg); } }
@keyframes bFlyShadow { 0%, 100% { transform: scaleX(1); opacity: .1; } 50% { transform: scaleX(.6); opacity: .05; } }
@keyframes bTickle { 0% { transform: rotate(0) scale(1); } 40% { transform: rotate(200deg) scale(1.15); } 100% { transform: rotate(360deg) scale(1); } }

/* ---------- Effects */
.hy-confetti { position: fixed; inset: 0; width: 100vw; height: 100vh; pointer-events: none; z-index: 100001; }
.huny-root .hy-vignette { position: fixed; inset: 0; pointer-events: none; z-index: 99998; box-shadow: inset 0 0 0 0 rgba(194,54,43,0); animation: hyVig .75s ease-out; }
@keyframes hyVig { 0% { box-shadow: inset 0 0 0 0 rgba(194,54,43,0); } 25% { box-shadow: inset 0 0 90px 18px rgba(194,54,43,.45); } 100% { box-shadow: inset 0 0 0 0 rgba(194,54,43,0); } }
.huny-root .hy-xp-fly { position: fixed; z-index: 100002; pointer-events: none; background: var(--honey); color: var(--ink); font-weight: 800; padding: 4px 12px; border-radius: 999px; box-shadow: 0 6px 18px rgba(201,119,0,.4); }
.huny-root .hy-fx { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 16px; background: rgba(20,22,43,.62); animation: hyFade .25s ease-out; }
.huny-root .hy-fx.hy-fx-out { animation: hyFadeOut .25s ease-in forwards; }
.huny-root .hy-fx-card { position: relative; width: min(440px, 100%); background: #fff; border-radius: 28px; padding: 22px 22px 24px; text-align: center; overflow: hidden; animation: hyCardPop .55s cubic-bezier(.34,1.56,.64,1); }
.huny-root .hy-fx-card h2 { font-size: clamp(26px, 5vw, 34px); margin: 6px 0 4px; }
.huny-root .hy-fx-card p { color: var(--ink2); margin: 0 auto 14px; max-width: 34ch; }
.huny-root .hy-fx-btns { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.huny-root .hy-fx-stage { position: relative; height: 190px; display: grid; place-items: center; margin: -6px -22px 0; }
.huny-root .hy-fx-level .hy-fx-stage, .huny-root .hy-fx-exam .hy-fx-stage, .huny-root .hy-fx-course .hy-fx-stage { background: radial-gradient(circle at 50% 55%, #FFF4E3 0, #FFE0A8 60%, #FFD47E 100%); }
.huny-root .hy-rays { position: absolute; inset: -60%; background: repeating-conic-gradient(from 0deg, rgba(255,255,255,.55) 0 8deg, transparent 8deg 22deg); animation: hySpin 14s linear infinite; }
.huny-root .hy-lvl-hex { position: relative; width: 116px; height: 132px; clip-path: var(--hex); background: var(--ink); display: grid; place-content: center; text-align: center; color: #fff; animation: hyLvl .9s cubic-bezier(.34,1.56,.64,1) .1s both; }
.huny-root .hy-lvl-hex small { font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #FFC53D; }
.huny-root .hy-lvl-hex b { font-family: 'Bricolage Grotesque', sans-serif; font-size: 58px; line-height: 1; }
.huny-root .hy-fx-bee { position: absolute; right: 18px; bottom: 6px; animation: hyBeeIn .8s cubic-bezier(.34,1.56,.64,1) .35s both; }
.huny-root .hy-medal-wrap { position: relative; transform-origin: 50% 0; animation: hyMedal 1.6s cubic-bezier(.34,1.56,.64,1) both; }
.huny-root .hy-medal-wrap svg { display: block; filter: drop-shadow(0 8px 12px rgba(201,119,0,.35)); }
.huny-root .hy-fx-energy .hy-fx-stage { background: linear-gradient(#1E2148, #3A3E7A 70%, #5C5FA8); }
.huny-root .hy-scene { width: 260px; height: 180px; display: block; }
.huny-root .sc-stem { stroke-dasharray: 90; stroke-dashoffset: 90; animation: hyDraw .7s ease-out .1s forwards; }
.huny-root .sc-leaf, .huny-root .sc-bloom { transform-box: fill-box; transform-origin: 50% 100%; transform: scale(0); animation: hyBloom .7s cubic-bezier(.34,1.56,.64,1) .6s forwards; }
.huny-root .sc-bloom { transform-origin: 50% 70%; animation-delay: .8s; }
.huny-root .sc-star { animation: hyTwinkle 1.8s ease-in-out infinite; } .huny-root .sc-star.s1 { animation-delay: .5s; } .huny-root .sc-star.s2 { animation-delay: 1s; } .huny-root .sc-star.s3 { animation-delay: 1.3s; }
.huny-root .hy-flyer { position: absolute; left: 50%; top: 50%; margin: -37px 0 0 -37px; animation: hyFlyIn 2.3s cubic-bezier(.45,.05,.4,1) both; }
.huny-root .hy-flyer.hy-landing { animation: hyLand .9s cubic-bezier(.5, 0, .6, 1) forwards; }
.huny-root .hy-flyer.hy-landed { animation: none; transform: translate(20px, -12px); }
.huny-root .hy-fx-energy .sc-bloom { transition: transform .5s ease; }
.huny-root .hy-fx-energy .hy-dozing .sc-bloom, .huny-root .hy-fx-energy .hy-asleep .sc-bloom { animation: hyBloomDip .7s ease-out forwards; }
.huny-root .hy-fx-energy .hy-asleep .sc-star { animation-duration: 3.6s; }
.huny-root .hy-fx-energy .hy-asleep .sc-moon { animation: hyMoonGlow 3.6s ease-in-out infinite; }
@keyframes hyLand { 0% { transform: translate(20px, -60px); } 70% { transform: translate(20px, -10px) scale(1, .96); } 100% { transform: translate(20px, -12px) scale(1.03, .94); } }
@keyframes hyBloomDip { 0% { transform: scale(1); } 40% { transform: scale(.94, .9); } 100% { transform: scale(.97, .95); } }
@keyframes hyMoonGlow { 0%, 100% { opacity: .85; } 50% { opacity: 1; } }
@keyframes hyFade { from { opacity: 0; } } @keyframes hyFadeOut { to { opacity: 0; } }
@keyframes hyCardPop { 0% { transform: scale(.6) translateY(30px); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes hyLvl { 0% { transform: scale(0) rotate(-180deg); } 100% { transform: scale(1) rotate(0); } }
@keyframes hyBeeIn { 0% { transform: translate(120px, 40px) rotate(30deg) scale(.5); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes hyMedal { 0% { transform: translateY(-240px) rotate(-25deg); } 45% { transform: translateY(8px) rotate(12deg); } 65% { transform: rotate(-8deg); } 82% { transform: rotate(4deg); } 100% { transform: rotate(0); } }
@keyframes hyDraw { to { stroke-dashoffset: 0; } }
@keyframes hyBloom { to { transform: scale(1); } }
@keyframes hyTwinkle { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
@keyframes hyFlyIn { 0% { transform: translate(-220px, -40px) scale(.7); } 30% { transform: translate(-80px, -95px) rotate(-10deg); } 55% { transform: translate(70px, -30px) rotate(10deg); } 75% { transform: translate(0, -90px) rotate(-6deg); } 100% { transform: translate(20px, -60px); } }

/* ---------- Page headers + catalogue */
.huny-root .hy-page-h { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin: 4px 0 12px; }
.huny-root .hy-page-h h1 { margin: 0 0 4px; font-size: clamp(32px, 5vw, 46px); }
.huny-root .hy-page-h p { margin: 0; max-width: 54ch; }
.huny-root .hy-tabs { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 12px; margin-bottom: 6px; scrollbar-width: none; }
.huny-root .hy-tabs button { flex: none; padding: 9px 16px; border-radius: 999px; border: 2px solid var(--line); font-weight: 700; font-size: 15px; background: #fff; transition: background .15s, border-color .15s; }
.huny-root .hy-tabs button:hover { border-color: var(--ink); background: #fff; }
.huny-root .hy-tabs button[aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.huny-root .hy-psec { margin: 18px 0 34px; }
.huny-root .hy-psec-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin-bottom: 14px; }
.huny-root .hy-psec-h h2 { margin: 0; }
.huny-root .hy-psec-h p { margin: 0; font-size: 15px; }
.huny-root .hy-cgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(214px, 1fr)); gap: 18px; }
.huny-root .hy-cc { display: flex; flex-direction: column; text-decoration: none; color: var(--ink); background: #fff; border-radius: 20px; border: 2px solid var(--line); overflow: hidden; transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s, border-color .2s; }
.huny-root .hy-cc:hover { transform: translateY(-5px); border-color: var(--ink); color: var(--ink); box-shadow: 0 16px 28px -16px rgba(20,22,43,.35); }
.huny-root .hy-cc-art { display: block; aspect-ratio: 4 / 3; max-width: 100%; background: var(--c1); overflow: hidden; }
.huny-root .hy-art { display: block; width: 100%; height: 100%; transition: transform .4s cubic-bezier(.34,1.56,.64,1); }
.huny-root .hy-cc:hover .hy-art { transform: scale(1.06) rotate(-1deg); }
.huny-root .hy-cc-body { display: grid; gap: 4px; padding: 12px 14px 14px; }
.huny-root .hy-cc-kick { font-size: 12px; font-weight: 700; color: var(--ink2); text-transform: uppercase; letter-spacing: .05em; }
.huny-root .hy-cc-t { font-family: 'Bricolage Grotesque', 'Figtree', sans-serif; font-weight: 800; font-size: 19px; line-height: 1.15; text-wrap: balance; }
.huny-root .hy-cc-tag { font-size: 13px; font-weight: 700; color: var(--leaf-t); }
.huny-root .hy-cc-prog, .huny-root .hy-cprog { display: flex; align-items: center; gap: 8px; }
.huny-root .hy-cc-prog small, .huny-root .hy-cprog small { font-weight: 700; color: var(--ink2); white-space: nowrap; }
.huny-root .hy-cprog .hy-progress { flex: 1; }
/* art motion */
.huny-root .hy-art g { transform-box: fill-box; transform-origin: center; }
.huny-root .hy-art .a-float { animation: aFloat 3.4s ease-in-out infinite; }
.huny-root .hy-art .a-sway { transform-origin: 50% 100%; animation: aSway 4s ease-in-out infinite; }
.huny-root .hy-art .a-spin { transform-box: fill-box; transform-origin: 50% 50%; animation: hySpin 2.4s linear infinite; }
.huny-root .hy-art .a-pulse { animation: aPulse 2.2s ease-in-out infinite; }
.huny-root .hy-art .a-drop { animation: aDrop 2.4s ease-in infinite; }
.huny-root .hy-art .d1 { animation-delay: .5s; } .huny-root .hy-art .d2 { animation-delay: 1s; }
@keyframes aFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes aSway { 0%, 100% { transform: rotate(-2deg); } 50% { transform: rotate(2.5deg); } }
@keyframes aPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.07); } }
@keyframes aDrop { 0% { transform: translateY(-6px); opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(42px); opacity: 0; } }

/* ---------- Home */
.huny-root .hy-sec-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 32px 0 12px; }
.huny-root .hy-sec-row h2 { margin: 0; }
.huny-root .hy-more-link { font-weight: 700; text-decoration: none; }
.huny-root .hy-continue-m { position: relative; flex: none; }
.huny-root .hy-continue-art { display: block; width: 170px; aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden; background: var(--c1); border: 2px solid var(--ink); }
.huny-root .hy-continue-m .hy-huny-wrap { position: absolute; right: -22px; bottom: -18px; }
.huny-root .hy-continue .hy-cprog { margin: 6px 0 2px; max-width: 360px; }

/* ---------- Course page */
.huny-root .hy-chero { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 26px; align-items: center; background: var(--c1); border-radius: 28px; padding: 22px; margin-bottom: 22px; position: relative; overflow: hidden; }
.huny-root .hy-chero-art { border-radius: 20px; overflow: hidden; border: 3px solid var(--ink); background: #fff; aspect-ratio: 4 / 3; max-width: 100%; box-shadow: 8px 8px 0 var(--ink); }
.huny-root .hy-chero-t { min-width: 0; }
.huny-root .hy-chero-t h1 { margin: 2px 0 8px; font-size: clamp(30px, 4.6vw, 44px); }
.huny-root .hy-chero-d { font-size: 18px; max-width: 52ch; }
.huny-root .hy-chero .hy-progress { background: rgba(255,255,255,.7); }
.huny-root .hy-chero .hy-row { margin-top: 12px; }
.huny-root .hy-ch { border: 2px solid var(--line); border-radius: 22px; margin: 14px 0; background: #fff; overflow: hidden; }
.huny-root .hy-ch > summary { list-style: none; cursor: pointer; padding: 16px 18px; }
.huny-root .hy-ch > summary::-webkit-details-marker { display: none; }
.huny-root .hy-ch-h { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.huny-root .hy-ch-tt { flex: 1; min-width: 0; }
.huny-root .hy-ch-tt h2 { margin: 0; font-size: 21px; }
.huny-root .hy-ch-tt .hy-eyebrow { margin-bottom: 0; }
.huny-root .hy-ch-n { width: 44px; height: 50px; clip-path: var(--hex); background: var(--ink); color: #fff; display: grid; place-items: center; font-weight: 800; font-family: 'Bricolage Grotesque', sans-serif; font-size: 20px; flex: none; }
.huny-root .hy-ch-gold { border-color: #E8C877; background: #FFFBEF; } .huny-root .hy-ch-gold .hy-ch-n { background: #C99A2E; }
.huny-root .hy-ch-lock .hy-ch-n { background: #A9A59B; }
.huny-root .hy-lpath { list-style: none; margin: 0; padding: 4px 18px 20px 30px; display: grid; gap: 6px; position: relative; }
.huny-root .hy-lpath::before { content: ""; position: absolute; left: 51px; top: 10px; bottom: 30px; width: 4px; border-radius: 4px; background: repeating-linear-gradient(var(--line) 0 8px, transparent 8px 14px); }
.huny-root .hy-lpath li { animation: hyEnter .35s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(var(--i) * 30ms); }
.huny-root .hy-ln { display: flex; align-items: center; gap: 14px; width: 100%; text-decoration: none; color: var(--ink); padding: 6px 10px 6px 0; border-radius: 16px; text-align: left; }
.huny-root a.hy-ln:hover, .huny-root button.hy-ln:hover { background: var(--surface); color: var(--ink); }
.huny-root .hy-ln-dot { position: relative; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; flex: none; background: #fff; border: 3px solid #D6D2C8; font-weight: 800; z-index: 1; transition: transform .2s cubic-bezier(.34,1.56,.64,1); }
.huny-root a.hy-ln:hover .hy-ln-dot { transform: scale(1.1); }
.huny-root .hy-ln-t { display: grid; min-width: 0; }
.huny-root .hy-ln-t b { font-size: 16px; line-height: 1.25; }
.huny-root .hy-ln-t small { font-size: 13px; color: var(--ink2); font-weight: 600; }
.huny-root .hy-ln-done .hy-ln-dot { background: var(--leaf); border-color: var(--leaf); color: #fff; }
.huny-root .hy-ln-open .hy-ln-dot { border-color: var(--honey); background: var(--honey-s); }
.huny-root .hy-ln-cur .hy-ln-dot { width: 58px; height: 58px; margin-left: -6px; background: var(--honey); border-color: var(--ink); box-shadow: 0 0 0 0 rgba(255,159,26,.6); animation: hyPulse 1.8s ease-out infinite; }
.huny-root .hy-ln-cur .hy-ln-dot .hy-huny-wrap { position: absolute; right: -30px; top: -26px; pointer-events: none; }
.huny-root .hy-ln-cur .hy-ln-t b { font-size: 18px; }
.huny-root .hy-ln-waiting, .huny-root .hy-ln-locked { color: var(--ink2); }
.huny-root .hy-ln-locked .hy-ln-dot { background: #F1EEE7; border-color: #E4E1D9; }
.huny-root .hy-ln-locked .hy-ln-dot::after { content: ""; width: 14px; height: 11px; border-radius: 3px; background: #A9A59B; box-shadow: 0 -7px 0 -2px transparent; position: relative; top: 3px; }
.huny-root .hy-ln-locked .hy-ln-dot::before { content: ""; position: absolute; width: 10px; height: 10px; border: 3px solid #A9A59B; border-bottom: 0; border-radius: 7px 7px 0 0; top: 10px; }
.huny-root .hy-ln-exam .hy-ln-dot { border-radius: 14px; transform: rotate(45deg); }
.huny-root .hy-ln-exam .hy-ln-dot > * { transform: rotate(-45deg); }
@keyframes hyPulse { 0% { box-shadow: 0 0 0 0 rgba(255,159,26,.55); } 70% { box-shadow: 0 0 0 16px rgba(255,159,26,0); } 100% { box-shadow: 0 0 0 0 rgba(255,159,26,0); } }
.huny-root .hy-exam-card { display: block; padding: 18px 20px; }
.huny-root .hy-exam-card .hy-row { flex-wrap: nowrap; align-items: center; gap: 18px; }
.huny-root .hy-exam-medal svg { width: 70px; height: auto; display: block; }
.huny-root .hy-exam-t { min-width: 0; } .huny-root .hy-exam-t h2 { margin: 0 0 4px; } .huny-root .hy-exam-card .hy-eyebrow { color: #FFC53D; }

/* ---------- Lesson player */
.huny-root .hy-lesson-top { gap: 14px; }
.huny-root .hy-x-link { font-size: 30px; line-height: 1; text-decoration: none; color: var(--ink2); width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.huny-root .hy-x-link:hover { background: var(--surface); color: var(--ink); }
.huny-root .hy-nowrap { white-space: nowrap; }
.huny-root .hy-dot { max-width: none; height: 10px; }
.huny-root .hy-dot-on { animation: hyDotOn .6s cubic-bezier(.34,1.56,.64,1); }
@keyframes hyDotOn { 0% { transform: scaleY(1); } 50% { transform: scaleY(1.8); } 100% { transform: scaleY(1); } }
.huny-root .hy-center-col { align-items: center; text-align: center; }
.huny-root .hy-story { position: relative; background: #FFFCF5; border-color: #FFD699; animation: hyCardIn .45s cubic-bezier(.2,.8,.2,1); padding-right: 96px; }
.huny-root .hy-story-t { font-family: 'Bricolage Grotesque', 'Figtree', sans-serif; font-size: clamp(21px, 2.7vw, 27px); font-weight: 600; line-height: 1.4; margin: 10px 0 0; max-width: 34em; }
.huny-root .hy-story-t b { color: var(--honey-t); }
.huny-root .hy-story-bee { position: absolute; right: 16px; top: 16px; }
.huny-root .hy-idea .hy-teach-big b { background: linear-gradient(transparent 58%, #FFE0A8 58%); }
.huny-root .hy-tipwrap { background: transparent; border: 0; padding: 6px 0 0; position: relative; }
.huny-root .hy-tip { position: relative; background: #FFF3B0; border-radius: 6px 6px 22px 6px; padding: 26px 24px 20px; transform: rotate(-1.2deg); box-shadow: 0 1px 0 #E8D77A, 0 18px 30px -18px rgba(20,22,43,.4); animation: hyTip .6s cubic-bezier(.34,1.56,.64,1); max-width: 640px; }
.huny-root .hy-tip-pin { position: absolute; top: -10px; left: 50%; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%; background: #E5484D; box-shadow: inset -3px -3px 0 rgba(0,0,0,.15), 0 3px 4px rgba(0,0,0,.2); }
.huny-root .hy-tip-t { font-size: 20px; line-height: 1.5; margin: 6px 0 12px; }
.huny-root .hy-tip-r { display: inline-grid; gap: 2px; background: #fff; border: 2px dashed #C9A23A; border-radius: 14px; padding: 8px 14px; margin: 0; }
.huny-root .hy-tip-r small { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--honey-t); }
.huny-root .hy-tip-r b { font-size: 18px; }
.huny-root .hy-tip-bee { position: absolute; right: 8px; top: -18px; }
@keyframes hyCardIn { from { opacity: 0; transform: translateX(40px) rotate(2deg); } to { opacity: 1; transform: none; } }
@keyframes hyTip { 0% { transform: rotate(-12deg) scale(.6); opacity: 0; } 100% { transform: rotate(-1.2deg) scale(1); opacity: 1; } }
.huny-root .hy-recap { gap: 14px; }
.huny-root .hy-recap-top { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.huny-root .hy-recap-top h1 { margin: 0 0 8px; }
.huny-root .hy-rcs { display: grid; gap: 10px; }
.huny-root .hy-rc { border-radius: 16px; padding: 12px 16px; background: var(--surface); animation: hyEnter .45s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(.3s + var(--i) * .25s); }
.huny-root .hy-rc small { font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--ink2); }
.huny-root .hy-rc p { margin: 2px 0 0; font-size: 17px; }
.huny-root .hy-rc-0 { background: var(--leaf-s); } .huny-root .hy-rc-0 small { color: var(--leaf-t); }
.huny-root .hy-rc-1 { background: var(--honey-s); } .huny-root .hy-rc-1 small { color: var(--honey-t); }
.huny-root .hy-rc-2 { background: #EEF4FF; } .huny-root .hy-rc-2 small { color: #123E8F; }
.huny-root .hy-sheet-ok { position: relative; overflow: hidden; }
.huny-root .hy-sheet-h .hy-huny-wrap { margin-top: -6px; }
.huny-root .hy-shake { animation: hyShake2 .55s cubic-bezier(.36,.07,.19,.97); }
@keyframes hyShake2 { 10%, 90% { transform: translateX(-2px); } 20%, 80% { transform: translateX(5px); } 30%, 50%, 70% { transform: translateX(-9px) rotate(-.4deg); } 40%, 60% { transform: translateX(9px) rotate(.4deg); } }
.huny-root .hy-loading { gap: 14px; }

@media (max-width: 760px) {
  .huny-root .hy-chero { grid-template-columns: 1fr; padding: 16px; }
  .huny-root .hy-chero-art { box-shadow: 5px 5px 0 var(--ink); }
  .huny-root .hy-nav { order: 3; width: 100%; margin: 0; }
  .huny-root .hy-chip-lvl { display: none; }
}
@media (max-width: 640px) {
  .huny-root .hy-cgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .huny-root .hy-cc-t { font-size: 16px; }
  .huny-root .hy-continue-art { width: 100%; }
  .huny-root .hy-continue-m { display: block; }
  .huny-root .hy-continue-m .hy-huny-wrap { right: 6px; bottom: -14px; }
  .huny-root .hy-story { padding-right: 16px; padding-top: 70px; }
  .huny-root .hy-page-h .hy-huny-wrap { display: none; }
  .huny-root .hy-exam-card .hy-row { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .huny-root *, .huny-root *::before, .huny-root *::after { animation: none !important; transition: none !important; } .hy-confetti { display: none; } }

/* ---- 1.2.0: Roots players ---- */
.huny-root .hy-buckets-5 { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.huny-root .hy-col-h { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--ink2); margin: 0 0 6px; }
.huny-root .hy-line .hy-ln { display: inline-block; min-width: 1.6em; font-weight: 800; color: var(--ink2); }
.huny-root .hy-line-row, .huny-root .hy-line-head { display: grid; grid-template-columns: 2fr 1fr; gap: 10px; text-align: left; }
.huny-root .hy-line-head { font-weight: 800; font-size: 13px; color: var(--ink2); padding: 4px 14px; }
.huny-root .hy-build-pick { list-style: none; padding-left: 0; }
.huny-root .hy-blankwrap { display: inline-flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.huny-root .hy-aff { font-weight: 700; color: var(--ink2); white-space: nowrap; }
.huny-root .hy-ledger .hy-cell { min-width: 90px; max-width: 160px; }
.huny-root .hy-cell-sel { font: inherit; border: 2px solid #CFCAC0; border-radius: 12px; padding: 9px 10px; background: #fff; max-width: 240px; }
.huny-root .hy-cell-sel.hy-good, .huny-root .hy-cell.hy-good { border-color: #1F8A4C; background: #EAF7EF; }
.huny-root .hy-cell-sel.hy-bad, .huny-root .hy-cell.hy-bad { border-color: #C2362B; background: #FDECEA; }
.huny-root .hy-num-date { display: inline-block; min-width: 120px; font-weight: 800; font-size: 22px; }
.huny-root .hy-notice { border-left: 4px solid var(--honey); }
.huny-root .hy-skip-card { text-align: left; margin-top: 16px; animation: hyPop .35s ease-out; }
.huny-root .hy-bigopt-i { display: block; font-size: 30px; line-height: 1; margin-bottom: 6px; }
.huny-root .hy-chips-fields .hy-bigopt { min-height: 110px; }
.huny-root .hy-note-card h2 { font-size: 20px; }
@media (max-width: 560px) {
  .huny-root .hy-line-row, .huny-root .hy-line-head { grid-template-columns: 1fr 1fr; }
  .huny-root .hy-ledger .hy-cell { min-width: 70px; }
}
/* Wide LEDGER tables become one card per row on phones: the row label on top, each cell with its column name. */
@media (max-width: 560px) {
  .huny-root .hy-ledger-wide, .huny-root .hy-ledger-wide tbody, .huny-root .hy-ledger-wide tr, .huny-root .hy-ledger-wide th, .huny-root .hy-ledger-wide td { display: block; width: 100%; box-sizing: border-box; }
  .huny-root .hy-ledger-wide thead { display: none; }
  .huny-root .hy-ledger-wide tr { border: 2px solid var(--line); border-radius: 14px; margin: 0 0 10px; overflow: hidden; background: #fff; }
  .huny-root .hy-ledger-wide th { background: var(--surface); border: 0; }
  .huny-root .hy-ledger-wide td { display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 0; border-top: 1px solid var(--line); }
  .huny-root .hy-ledger-wide td[data-col]:not([data-col=""])::before { content: attr(data-col); font-size: 13px; font-weight: 700; color: var(--ink2); }
  .huny-root .hy-ledger-wide .hy-cell { min-width: 0; width: 120px; }
  .huny-root .hy-ledger-wide .hy-cell-sel { width: auto; min-width: 150px; max-width: 65%; }
}

/* ===================================================================== 2.0 */

/* Level chip + popover */
.huny-root .hy-levelwrap { position: relative; display: inline-flex; }
.huny-root .hy-chip-level { background: #fff; color: var(--ink); border: 2px solid var(--ink); padding: 5px 12px; gap: 4px; }
.huny-root .hy-chip-level:hover { background: var(--honey-s); }
.huny-root .hy-caret { font-size: 11px; margin-left: 2px; }
.huny-root .hy-pop { position: absolute; top: calc(100% + 8px); right: 0; z-index: 9999; width: min(280px, calc(100vw - 32px)); background: #fff; border: 2px solid var(--ink); border-radius: 16px; padding: 10px; box-shadow: 6px 6px 0 var(--ink); display: grid; gap: 4px; animation: hyEnter .2s ease both; }
.huny-root .hy-pop-h { margin: 2px 6px 4px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--honey-t); }
.huny-root .hy-pop-i { display: flex; gap: 8px; align-items: center; padding: 9px 10px; border-radius: 10px; font-size: 15px; }
.huny-root .hy-pop-i b { width: 28px; }
.huny-root .hy-pop-i:hover, .huny-root .hy-pop-i:focus { background: var(--surface); }
.huny-root .hy-pop-i.hy-sel { background: var(--honey-s); font-weight: 700; }
.huny-root .hy-pop-f { margin: 4px 6px 0; }

/* Filters */
.huny-root .hy-filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 10px; align-items: end; background: var(--surface); border-radius: 20px; padding: 14px; margin: 8px 0 6px; }
.huny-root .hy-pick { position: relative; display: grid; gap: 4px; min-width: 0; }
.huny-root .hy-pick-l { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--ink2); }
.huny-root .hy-select, .huny-root .hy-pick-b { font: inherit; font-size: 15px; color: var(--ink); background: #fff; border: 2px solid #CFCAC0; border-radius: 12px; padding: 9px 12px; width: 100%; min-width: 0; min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 6px; text-align: left; }
.huny-root .hy-pick-b:hover, .huny-root .hy-select:hover { border-color: var(--ink); background: #fff; }
.huny-root .hy-pick-v { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.huny-root .hy-select-lg { font-size: 18px; min-height: 54px; max-width: 420px; margin: 16px auto; }
.huny-root .hy-pick-p { position: absolute; top: calc(100% + 6px); left: 0; z-index: 9998; width: max(100%, 280px); max-width: calc(100vw - 32px); background: #fff; border: 2px solid var(--ink); border-radius: 14px; padding: 8px; box-shadow: 6px 6px 0 var(--ink); }
.huny-root .hy-filters > :nth-child(4) .hy-pick-p { left: auto; right: 0; }
.huny-root .hy-pick-q, .huny-root .hy-search { font: inherit; font-size: 15px; width: 100%; border: 2px solid #CFCAC0; border-radius: 10px; padding: 9px 12px; background: #fff; color: var(--ink); }
.huny-root .hy-pick-list { max-height: 300px; overflow: auto; margin-top: 6px; display: grid; gap: 2px; }
.huny-root .hy-pick-g { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--honey-t); padding: 8px 8px 2px; }
.huny-root .hy-pick-o { display: block; width: 100%; padding: 8px 10px; border-radius: 8px; font-size: 15px; text-align: left; }
.huny-root .hy-pick-o:hover, .huny-root .hy-pick-o:focus { background: var(--surface); }
.huny-root .hy-pick-o.hy-sel { background: var(--honey-s); font-weight: 700; }
.huny-root .hy-filters .hy-btn { white-space: nowrap; }
.huny-root .hy-linkbtn { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
.huny-root .hy-linkbtn:hover { color: #0A46A8; }
.huny-root .hy-busy { opacity: .55; transition: opacity .15s; }

/* Your path */
.huny-root .hy-steps { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; counter-reset: step; }
.huny-root .hy-step { display: flex; gap: 12px; align-items: flex-start; text-decoration: none; color: var(--ink); background: #fff; border: 2px solid var(--line); border-radius: 18px; padding: 12px; min-width: 0; transition: transform .2s, border-color .2s; }
.huny-root .hy-step:hover { transform: translateY(-3px); border-color: var(--ink); color: var(--ink); }
.huny-root .hy-step-n { flex: none; width: 40px; height: 46px; clip-path: var(--hex); background: var(--c2); display: grid; place-items: center; font-weight: 800; font-family: 'Bricolage Grotesque', sans-serif; font-size: 18px; color: var(--ink); }
.huny-root .hy-step-start .hy-step-n { background: var(--honey); }
.huny-root .hy-step-certify .hy-step-n { background: #FFC53D; }
.huny-root .hy-step-b { display: grid; gap: 3px; min-width: 0; }
.huny-root .hy-step-k { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--honey-t); }
.huny-root .hy-step-t { font-size: 16px; line-height: 1.2; overflow-wrap: anywhere; }
.huny-root .hy-step-w { color: var(--ink2); font-size: 13px; }
.huny-root .hy-step .hy-tag { justify-self: start; }
.huny-root .hy-step-soon { background: #FCFBF8; }

/* Certification exams */
.huny-root .hy-cert-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.huny-root .hy-cert-c { background: #fff; border: 2px solid var(--line); border-radius: 20px; padding: 16px; display: grid; gap: 10px; align-content: start; min-width: 0; }
.huny-root .hy-cert-fsa { border-color: #C9B8F2; background: #FBF9FF; }
.huny-root .hy-cert-h { display: flex; gap: 12px; align-items: center; }
.huny-root .hy-cert-h h3 { margin: 0; }
.huny-root .hy-cert-h img { border-radius: 10px; flex: none; }
.huny-root .hy-cert-h .hy-exam-medal { width: 56px; height: 56px; flex: none; }
.huny-root .hy-cert-rows { display: grid; gap: 8px; }
.huny-root .hy-cert-row { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; border-top: 1px solid var(--line); padding-top: 8px; }
.huny-root .hy-cert-row > span { display: grid; gap: 2px; min-width: 0; }
.huny-root .hy-cert-row small { font-size: 12.5px; line-height: 1.35; }
.huny-root .hy-cert-p { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 20px; white-space: nowrap; }
.huny-root .hy-save { color: var(--leaf-t); font-weight: 700; }
.huny-root .hy-fsa-disc { color: var(--ink2); }
.huny-root .hy-priceline { display: inline-flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.huny-root .hy-priceline .hy-select { width: auto; max-width: 100%; min-height: 36px; padding: 4px 8px; }
.huny-root .hy-center-t { text-align: center; margin-top: 10px; }

/* All courses */
.huny-root .hy-listbar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.huny-root .hy-listbar .hy-search { flex: 1 1 220px; max-width: 420px; }
.huny-root .hy-all .hy-psec { content-visibility: auto; contain-intrinsic-size: auto 400px; }
.huny-root .hy-lvls { display: flex; gap: 4px; flex-wrap: wrap; }
.huny-root .hy-lvl { font-size: 11px; font-weight: 800; padding: 1px 7px; border-radius: 999px; background: #ECE9E2; color: var(--ink2); }
.huny-root .hy-chero .hy-lvl { background: rgba(255,255,255,.75); }
.huny-root .hy-cc-soon .hy-cc-art { filter: saturate(.55); }
.huny-root .hy-cc-soon-t { color: var(--honey-t); }
.huny-root .hy-cc .hy-art .a-float, .huny-root .hy-cc .hy-art .a-sway, .huny-root .hy-cc .hy-art .a-spin, .huny-root .hy-cc .hy-art .a-pulse, .huny-root .hy-cc .hy-art .a-drop { animation-play-state: paused; }
.huny-root .hy-cc:hover .hy-art .a-float, .huny-root .hy-cc:hover .hy-art .a-sway, .huny-root .hy-cc:hover .hy-art .a-spin, .huny-root .hy-cc:hover .hy-art .a-pulse, .huny-root .hy-cc:hover .hy-art .a-drop { animation-play-state: running; }

/* Course page */
.huny-root .hy-soon-note { background: rgba(255,255,255,.75); border-radius: 12px; padding: 10px 12px; }
.huny-root .hy-ltabs { margin-top: 4px; }
.huny-root .hy-ln-locked .hy-ln-dot { background: #F1EFEA; border-color: #D6D2C8; font-size: 16px; }
.huny-root button.hy-ln-locked .hy-ln-t small { color: var(--red); }
.huny-root .hy-fsa-marks { display: grid; gap: 10px; }
.huny-root .hy-fsa-imgs { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.huny-root .hy-fsa-main { max-width: min(260px, 100%); height: auto; }
.huny-root .hy-fsa-lvl { width: 88px; height: 88px; }
.huny-root .hy-fsa-attr { font-weight: 600; color: var(--ink2); margin: 0; }
.huny-root .hy-fsa-logo { display: block; max-width: 200px; height: auto; margin: 0 0 10px; }
.huny-root .hy-pass-pick { cursor: pointer; }
.huny-root .hy-pass-pick > span:first-child { display: grid; gap: 2px; }
.huny-root .hy-pass-pick small { font-size: 12.5px; }

/* Player: review badge, prev / next, unit drawer */
.huny-root .hy-review { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; background: var(--leaf-s); color: var(--leaf-t); border-radius: 12px; padding: 8px 12px; margin: 6px 0 10px; font-size: 14px; font-weight: 600; }
.huny-root .hy-review-b { background: var(--leaf); color: #fff; border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.huny-root .hy-lnav { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; margin: 22px 0 6px; padding-top: 14px; border-top: 1px solid var(--line); }
.huny-root .hy-lnav .hy-btn { white-space: nowrap; }
.huny-root .hy-nav-off { opacity: .4; pointer-events: none; }
.huny-root .hy-unit-btn { justify-content: center; min-width: 0; }
.huny-root .hy-unit-btn-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.huny-root .hy-drawer-l { list-style: none; margin: 10px 0 16px; padding: 0; display: grid; gap: 4px; }
.huny-root .hy-drawer .hy-ln-dot { width: 38px; height: 38px; }
.huny-root .hy-ln-here { background: var(--honey-s); }

/* Timed exam */
.huny-root .hy-exam-top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.huny-root .hy-clock { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 26px; background: var(--ink); color: #fff; border-radius: 14px; padding: 6px 14px; position: sticky; top: 8px; z-index: 5; }
.huny-root .hy-clock-low { background: var(--red); animation: aPulse 1s ease-in-out infinite; }

/* Onboarding 2.0 */
.huny-root .hy-chips-careers { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.huny-root .hy-chips-levels { grid-template-columns: 1fr; max-width: 560px; margin-left: auto; margin-right: auto; }
.huny-root .hy-bigopt-tx { display: grid; gap: 2px; }
.huny-root .hy-bigopt-tx small { font-weight: 500; font-size: 13.5px; color: var(--ink2); }
.huny-root .hy-indlist { max-height: 46vh; overflow: auto; text-align: left; border: 2px solid var(--line); border-radius: 14px; padding: 6px; margin: 10px 0; }
.huny-root .hy-onb .hy-search { max-width: 520px; margin: 0 auto; display: block; }

@media (max-width: 900px) {
  .huny-root .hy-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .huny-root .hy-filters .hy-btn { grid-column: 1 / -1; }
  .huny-root .hy-chips-careers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .huny-root .hy-steps { grid-template-columns: 1fr; }
  .huny-root .hy-chips-careers { grid-template-columns: 1fr; }
  .huny-root .hy-lnav .hy-unit-btn .hy-muted { display: none; }
  .huny-root .hy-pick-p { position: fixed; left: 16px; right: 16px; top: 20vh; width: auto; }
  .huny-root .hy-pop { position: fixed; top: 70px; right: 16px; }
}

.hy-phone{display:flex;gap:8px}.hy-phone .hy-select{flex:0 0 46%;min-width:0}.hy-phone .hy-input{flex:1;min-width:0}

/* 2.0.3 */
.huny-root .hy-cert-h .hy-exam-medal svg { width: 56px; height: 56px; }
.huny-root .hy-cert-c .hy-seelink { color: var(--ink); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; align-self: center; }
.huny-root .hy-have { display: grid; gap: 8px; margin: 10px 0; }
.huny-root .hy-have .hy-check { display: flex; gap: 8px; align-items: flex-start; }
.huny-root .hy-doc { display: grid; gap: 8px; margin: 10px 0; }
.huny-root .hy-doc input[type="file"] { max-width: 100%; }
.huny-root .hy-ok { color: var(--leaf-t); font-weight: 700; }
.huny-root .hy-addv[hidden] { display: none; }

/* 2.0.5 Pearson-style exam screen */
.huny-root .hy-pv-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.huny-root .hy-pv-tools { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 12px; position: sticky; top: 0; z-index: 4; background: var(--bg, #fff); padding: 6px 0; }
.huny-root .hy-pv-flag.hy-on { background: #FFE9A8; border-color: #B8860B; color: #5a4300; }
.huny-root .hy-pv-warn { margin: 8px 0; }
.huny-root .hy-pv-stage { display: block; }
.huny-root .hy-pv-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.huny-root .hy-pv-case { background: var(--card, #fff); border: 1px solid var(--line, #ddd); border-radius: 16px; padding: 16px; position: sticky; top: 56px; max-height: calc(100vh - 80px); overflow: auto; }
.huny-root .hy-pv-case h2 { font-size: 18px; margin: 4px 0 8px; }
.huny-root .hy-pv-casetext p { margin: 0 0 10px; line-height: 1.55; }
.huny-root .hy-pv-q { background: var(--card, #fff); border: 1px solid var(--line, #ddd); border-radius: 16px; padding: 16px; }
.huny-root .hy-pv-qn { font-size: 13px; color: var(--muted, #666); margin-bottom: 8px; }
.huny-root .hy-pv-foot { margin-top: 12px; justify-content: space-between; }
.huny-root .hy-opt-multi { display: flex; gap: 10px; align-items: flex-start; text-align: left; }
.huny-root .hy-opt-box { flex: 0 0 18px; height: 18px; border: 2px solid currentColor; border-radius: 5px; margin-top: 2px; position: relative; }
.huny-root .hy-opt-multi.hy-sel .hy-opt-box::after { content: '✓'; position: absolute; inset: -3px 0 0 2px; font-size: 14px; font-weight: 800; }
.huny-root .hy-nav-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 8px; margin: 12px 0; }
.huny-root .hy-nav-b { min-height: 44px; border-radius: 10px; border: 2px solid var(--line, #bbb); background: transparent; font-weight: 700; cursor: pointer; position: relative; color: inherit; }
.huny-root .hy-nav-done { background: #DDF3E4; border-color: #1F8A4C; }
.huny-root .hy-nav-todo { background: #fff; }
.huny-root .hy-nav-flag::after { content: '⚑'; position: absolute; top: -8px; right: -4px; font-size: 14px; color: #B8860B; }
.huny-root .hy-nav-cur { outline: 3px solid #0E5BDD; outline-offset: 1px; }
.huny-root .hy-nav-sample { display: inline-block; width: 18px; min-height: 18px; vertical-align: middle; cursor: default; }
.huny-root .hy-nav-leg { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.huny-root .hy-calc { position: fixed; right: 12px; bottom: 12px; width: 292px; max-width: calc(100vw - 24px); background: #14162B; color: #fff; border-radius: 16px; padding: 12px; z-index: 60; box-shadow: 0 12px 40px rgba(0,0,0,.35); }
.huny-root .hy-calc-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.huny-root .hy-calc-hist { font-size: 12px; color: #A9ACC4; min-height: 16px; text-align: right; overflow: hidden; }
.huny-root .hy-calc-out { display: block; font-size: 28px; font-weight: 800; text-align: right; min-height: 38px; overflow: hidden; padding: 2px 4px 8px; }
.huny-root .hy-calc-keys { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.huny-root .hy-ck { min-height: 42px; border: 0; border-radius: 10px; background: #2A2D4A; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; }
.huny-root .hy-ck-op { background: #E8A317; color: #14162B; }
.huny-root .hy-ck-sci { background: #3A3F66; font-size: 14px; }
.huny-root .hy-calc .hy-btn { color: #fff; border-color: #6a6e96; }
@media (max-width: 760px) { .huny-root .hy-pv-two { grid-template-columns: 1fr; } .huny-root .hy-pv-case { position: static; max-height: 40vh; } }

/* 2.0.6: back navigation inside a lesson */
.huny-root .hy-actions .hy-back{margin-right:auto;background:#fff;color:var(--ink);border:2px solid var(--honey);border-bottom-width:5px}
.huny-root .hy-actions .hy-back:hover{background:#FFF6E4}
.huny-root .hy-dot-btn{border:0;padding:0;cursor:pointer;position:relative}
.huny-root .hy-dot-btn::after{content:"";position:absolute;inset:-12px -4px}
.huny-root .hy-dot-btn:hover,.huny-root .hy-dot-btn:focus-visible{filter:brightness(.88);outline:2px solid var(--honey);outline-offset:2px}
.huny-root .hy-lbl-btn{background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;color:inherit;font:inherit}
@media (max-width:600px){.huny-root .hy-actions .hy-back{width:auto;flex:0 0 auto}}

/* 2.1.0 Hivedemy: rounded hexagons, to match the mark. Old browsers without masks keep the sharp clip-path above. */
.huny-root { --hexmask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20115.47'%20preserveAspectRatio='none'%3E%3Cpath%20d='M43.94%203.50Q50.00%200.00%2056.06%203.50L93.94%2025.37Q100.00%2028.87%20100.00%2035.87L100.00%2079.60Q100.00%2086.60%2093.94%2090.10L56.06%20111.97Q50.00%20115.47%2043.94%20111.97L6.06%2090.10Q0.00%2086.60%200.00%2079.60L0.00%2035.87Q0.00%2028.87%206.06%2025.37Z'/%3E%3C/svg%3E"); }
@supports ((mask-image: none) or (-webkit-mask-image: none)) {
.huny-root .hy-badge,
.huny-root .hy-branch-n,
.huny-root .hy-ch-n,
.huny-root .hy-drops i,
.huny-root .hy-hex,
.huny-root .hy-hex-in,
.huny-root .hy-hexcell,
.huny-root .hy-hexcell-in,
.huny-root .hy-lvl-hex,
.huny-root .hy-opt-k,
.huny-root .hy-step-n,
.huny-root .hy-worked li::before {
  clip-path: none; -webkit-mask: var(--hexmask) center / 100% 100% no-repeat; mask: var(--hexmask) center / 100% 100% no-repeat;
}
}

/* 2.1.0 Hivedemy: brand bar */
.huny-root .hy-mark { display: inline-flex; flex: none; }
.huny-root .hy-mark svg { display: block; }
.huny-root .hy-brand-t { letter-spacing: -.02em; }
.huny-root .hy-brand-t small { letter-spacing: .14em; text-transform: uppercase; font-size: 11px; }
.huny-root .hy-auth > .hy-mark { margin: 0 auto; }