:root { font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #163b3a; background: #f2ffff; }
* { box-sizing: border-box; } body { min-height: 100vh; margin: 0; background: linear-gradient(135deg, #d7f7f7, #f7ffff 55%, #fff); }
.page-shell { width: min(100% - 2rem, 67rem); min-height: 100vh; margin: auto; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(2rem, 8vw, 8rem); }
.intro { display: grid; gap: 2rem; }.brand { color: #176f70; font-size: 1.35rem; font-weight: 800; letter-spacing: -.08em; text-decoration: none; }.brand span { color: #33cccc; }
.eyebrow { margin: 0 0 .7rem; color: #178d8d; font-size: .72rem; font-weight: 800; letter-spacing: .14em; }.intro h1 { max-width: 34rem; margin: 0; font-size: clamp(2.6rem, 6vw, 4.6rem); letter-spacing: -.065em; line-height: .98; }.intro-copy { max-width: 28rem; color: #557574; font-size: 1.05rem; line-height: 1.6; }.prototype-note { color: #6b8988; font-size: .82rem; }
.auth-card { min-height: 31rem; padding: 2rem; border: 1px solid #d8efee; border-radius: 1.5rem; background: #fff; box-shadow: 0 1.5rem 4rem #0abab52e; }.tabs { display: flex; gap: 1.4rem; margin-bottom: 2.1rem; border-bottom: 1px solid #deefee; }
button { font: inherit; cursor: pointer; }.tab { margin-bottom: -1px; padding: 0 0 .8rem; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #728585; font-weight: 700; }.tab.active { border-color: #0abab5; color: #087a76; }
form { display: grid; gap: 1rem; } h2 { margin: 0; font-size: 1.8rem; letter-spacing: -.045em; } form > p { margin: -.5rem 0 .7rem; color: #728585; font-size: .92rem; } label { display: grid; gap: .42rem; color: #315b5a; font-size: .84rem; font-weight: 700; } input { width: 100%; padding: .78rem .9rem; border: 1px solid #cae5e4; border-radius: .65rem; color: #163b3a; font: inherit; outline: none; } input:focus { border-color: #0abab5; box-shadow: 0 0 0 3px #c8f2f0; }
.password-control { position: relative; display: block; }.password-control input { padding-right: 4.6rem; }.password-control button { position: absolute; top: 50%; right: .45rem; transform: translateY(-50%); border: 0; background: transparent; color: #087a76; font-size: .78rem; font-weight: 800; }
.primary, .secondary { padding: .85rem 1rem; border: 0; border-radius: .65rem; font-weight: 800; }.primary { background: #33cccc; color: #073c3b; }.primary:hover { background: #22baba; }.secondary { border: 1px solid #bce2e0; background: #fff; color: #087a76; }.message { min-height: 1.25rem; margin: 0; color: #be123c; font-size: .82rem; }.message.success { color: #15803d; }.hidden { display: none !important; }
.member-view { min-height: 25rem; place-content: center; text-align: center; }.avatar { display: grid; width: 4rem; aspect-ratio: 1; margin: 0 auto 1.4rem; place-items: center; border-radius: 50%; background: #d8f5f3; color: #078f8b; font-size: 2rem; font-weight: 800; }.member-view p:not(.eyebrow) { margin: .5rem 0 2rem; color: #728585; }
.app-view { width: min(100vw - 2rem, 74rem); min-height: min(44rem, 90vh); display: grid; grid-template-columns: 15rem 1fr; overflow: hidden; border: 1px solid #b8e7e7; border-radius: 1.5rem; background: #faffff; box-shadow: 0 1.5rem 4rem #15999928; }.sidebar { display: flex; flex-direction: column; gap: 2.5rem; padding: 1.8rem 1rem; background: #e4fafa; }.sidebar nav { display: grid; gap: .4rem; }.nav-item { display: flex; gap: .75rem; align-items: center; padding: .8rem .9rem; border: 0; border-radius: .7rem; background: transparent; color: #416b6b; text-align: left; font-weight: 700; }.nav-item:hover, .nav-item.active { background: #c5f2f2; color: #126d6d; }.profile-wrap { position: relative; margin-top: auto; }.profile-button { display: grid; grid-template-columns: 2.2rem 1fr auto; gap: .6rem; width: 100%; align-items: center; padding: .65rem; border: 0; border-radius: .75rem; background: #fff; color: #315b5a; text-align: left; }.profile-avatar { display: grid; width: 2.2rem; aspect-ratio: 1; place-items: center; border-radius: 50%; background: #33cccc; color: #073c3b; font-weight: 900; }.profile-button small { display: block; margin-top: .1rem; color: #789493; }.profile-menu { position: absolute; right: 0; bottom: 3.4rem; z-index: 2; width: 13rem; padding: .4rem; border: 1px solid #b8e7e7; border-radius: .75rem; background: #fff; box-shadow: 0 .8rem 2rem #126d6d25; }.profile-menu button { display: flex; justify-content: space-between; width: 100%; padding: .65rem; border: 0; border-radius: .45rem; background: transparent; color: #315b5a; text-align: left; }.profile-menu button:hover { background: #e4fafa; }.profile-menu span { color: #789493; }.dashboard { padding: clamp(1.5rem, 5vw, 4rem); overflow: auto; }.page-panel h2 { font-size: clamp(2rem, 4vw, 3rem); }.muted { color: #6d8a89; }.hero-card { display: flex; justify-content: space-between; gap: 1rem; margin: 2rem 0 1rem; padding: 2rem; border-radius: 1.25rem; background: #33cccc; color: #0a4443; }.hero-card h3 { max-width: 20rem; margin: 0; font-size: 1.8rem; letter-spacing: -.04em; }.hero-card p:not(.eyebrow) { max-width: 22rem; }.hero-card .primary { background: #fff; }.book-mark { display: grid; min-width: 7rem; place-items: center; border-radius: 1rem; background: #e4ffff; font-size: 3rem; }.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }.stat-grid article { padding: 1rem; border: 1px solid #d5eeee; border-radius: .9rem; background: #fff; }.stat-grid span { color: #178d8d; font-size: 1.8rem; font-weight: 800; }.stat-grid p { margin: .25rem 0 0; color: #6d8a89; font-size: .8rem; }
.signed-in .page-shell { width: 100%; min-height: 100vh; display: block; padding: 0; }
.signed-in .intro { display: none; }
.signed-in .auth-card { min-height: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
.signed-in .app-view { width: 100%; min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; }
.checking-session .auth-card { visibility: hidden; }
.empty-action { display: flex; align-items: center; gap: 1rem; margin-top: 2rem; padding: 1.2rem; border: 1px solid #cbecec; border-radius: 1rem; background: #f7ffff; }.empty-action > span { display: grid; width: 2.8rem; aspect-ratio: 1; place-items: center; border-radius: .8rem; background: #d8f7f7; color: #157c7d; font-size: 1.35rem; font-weight: 900; }.empty-action div { flex: 1; }.empty-action strong { color: #315b5a; }.empty-action p { margin: .2rem 0 0; color: #6d8a89; font-size: .84rem; }.onboarding { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; padding: 1rem; background: #0c515155; backdrop-filter: blur(.4rem); }.onboarding-card { width: min(100%, 28rem); padding: 2rem; border: 1px solid #bdecec; border-radius: 1.4rem; background: #fff; box-shadow: 0 1.5rem 4rem #073c3b45; text-align: center; }.onboarding-card h2 { margin: 0; }.onboarding-card .muted { margin: .7rem 0 1.5rem; line-height: 1.5; }.avatar-uploader { display: grid; justify-items: center; gap: .45rem; margin: 1rem 0; padding: 1rem; border: 1px dashed #77cfcf; border-radius: 1rem; background: #f3ffff; color: #176f70; cursor: pointer; }.avatar-uploader > span { display: grid; width: 5rem; aspect-ratio: 1; place-items: center; overflow: hidden; border: .2rem solid #fff; border-radius: 50%; background: #33cccc; background-position: center; background-size: cover; color: #073c3b; font-size: 2rem; font-weight: 900; box-shadow: 0 .3rem .8rem #0c77772b; }.avatar-uploader small { color: #6d8a89; }.onboarding-card .primary { width: 100%; }.text-button { margin-top: .8rem; border: 0; background: transparent; color: #5e8583; font-size: .84rem; font-weight: 700; }.profile-avatar.has-image { background-position: center; background-size: cover; color: transparent; }
.leaderboard-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }.leaderboard-heading .secondary { white-space: nowrap; }.leaderboard-tabs { display: flex; gap: .45rem; margin: 1.7rem 0; padding: .3rem; width: fit-content; border-radius: .75rem; background: #e8f8f8; }.board-tab { padding: .5rem .75rem; border: 0; border-radius: .55rem; background: transparent; color: #527574; font-size: .82rem; font-weight: 800; }.board-tab.active { background: #fff; color: #167879; box-shadow: 0 .15rem .5rem #168b8b17; }.podium { display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: .75rem; padding: 1.5rem 1rem 0; border: 1px solid #d5eeee; border-radius: 1.2rem 1.2rem 0 0; background: linear-gradient(180deg, #efffff, #d7f8f8); text-align: center; }.podium article { display: grid; justify-items: center; gap: .35rem; min-height: 8.2rem; padding: 1rem .45rem; border-radius: .9rem .9rem 0 0; background: #fff; }.podium .first { min-height: 10.2rem; background: linear-gradient(180deg, #ffe995, #f5c954); color: #62470a; }.podium .second { background: linear-gradient(180deg, #f4f7f8, #cbd5da); color: #40545c; }.podium .third { background: linear-gradient(180deg, #ffe1c4, #d99a66); color: #633718; }.podium small { color: currentColor; opacity: .75; font-size: .75rem; }.rank-row small { color: #5d8886; font-size: .75rem; }.podium-holder { position: relative; display: grid; place-items: center; width: 4.25rem; aspect-ratio: 1; }.podium-holder::before { position: absolute; inset: .15rem; border: .28rem solid var(--medal-ring); border-radius: 50%; content: ''; box-shadow: inset 0 0 0 .12rem #ffffff99, 0 .25rem .7rem #125d5d2b; }.first .podium-holder { --medal-ring: #d99c17; }.second .podium-holder { --medal-ring: #92a4ae; }.third .podium-holder { --medal-ring: #b76832; }.medal { position: absolute; bottom: -.65rem; z-index: 2; display: grid; width: 2rem; aspect-ratio: 1; place-items: center; border: .16rem solid #fff; border-radius: 50%; background: #fff; font-size: 1.3rem; line-height: 1; filter: drop-shadow(0 .16rem .22rem #125d5d35); }.reader-avatar { position: relative; z-index: 1; display: grid; width: 3.15rem; aspect-ratio: 1; place-items: center; border: .14rem solid #fff; border-radius: 50%; background: #33cccc; color: #073c3b; font-weight: 900; }.reader-avatar.small { width: 2rem; border: 0; font-size: .75rem; }.reader-avatar.lilac { background: #e4ddff; color: #5f4b9b; }.reader-avatar.peach { background: #ffdfcd; color: #9c5431; }.reader-avatar.gold { background: #fff1aa; color: #8b6710; }.reader-avatar.aqua { background: #c9f3eb; color: #237363; }.rank-list { overflow: hidden; border: 1px solid #d5eeee; border-top: 0; border-radius: 0 0 1.2rem 1.2rem; background: #fff; }.rank-row { display: grid; grid-template-columns: 1.6rem 2rem 1fr auto; align-items: center; gap: .7rem; padding: .8rem 1rem; border-top: 1px solid #e7f3f3; color: #527574; font-size: .85rem; }.rank-row:first-child { border-top: 0; }.rank-row strong { color: #315b5a; }.rank-row.you { border: 1px solid #33cccc; background: #edffff; }.rank-row.you small { color: #178d8d; font-weight: 700; }
@media (max-width: 720px) { .page-shell { min-height: auto; padding: 2rem 0; grid-template-columns: 1fr; gap: 2.5rem; }.intro { gap: 1.2rem; }.auth-card { padding: 1.5rem; }.intro h1 { font-size: clamp(2.6rem, 14vw, 4rem); } }
@media (max-width: 720px) { .app-view { grid-template-columns: 1fr; }.sidebar { flex-direction: row; gap: .5rem; align-items: center; padding: 1rem; }.sidebar nav { display: flex; overflow-x: auto; }.nav-item { white-space: nowrap; }.sidebar > .brand, .profile-wrap { display: none; }.dashboard { min-height: 35rem; }.stat-grid { grid-template-columns: 1fr; } }

.avatar-uploader { width: 100%; font: inherit; }
.photo-settings { display: flex; align-items: flex-start; gap: 1.5rem; margin-top: 2rem; padding: 1.5rem; border: 1px solid #cbecec; border-radius: 1rem; background: #fff; }
.profile-avatar.settings-avatar { flex-shrink: 0; width: 5rem; font-size: 2rem; }
.photo-settings h3 { margin: 0; }
.photo-actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-bottom: .75rem; }
button:disabled { opacity: .6; cursor: wait; }
button:focus-visible { outline: 3px solid #087a76; outline-offset: 3px; }
.onboarding { overflow-y: auto; }
.onboarding-card { margin: auto; }
@media (max-width: 720px) { .sidebar { flex-wrap: wrap; } .sidebar nav { width: 100%; } .sidebar .profile-wrap { display: block; margin-left: auto; } .profile-menu { top: 3.4rem; bottom: auto; } .photo-settings { flex-direction: column; } .empty-action { flex-wrap: wrap; } }

.sidebar, .dashboard, .sidebar nav { min-width: 0; }
@media (max-width: 720px) { .app-view { grid-template-columns: minmax(0, 1fr); } .profile-wrap { max-width: 100%; } .hero-card { flex-wrap: wrap; } .book-mark { display: none; } }

.language-picker { display: flex; gap: .75rem; margin: 0 0 1.5rem; padding: 1rem; border: 1px solid #cbecec; border-radius: .8rem; text-align: left; }
.language-picker legend { color: #176f70; font-weight: 700; padding: 0 .4rem; }
.language-picker label { display: flex; align-items: center; gap: .5rem; flex: 1; cursor: pointer; }
.language-picker input { width: auto; accent-color: #087a76; }
.language-settings { display: grid; gap: .8rem; max-width: 26rem; margin-top: 2rem; }
.language-settings select { padding: .8rem; border: 1px solid #b8e7e7; border-radius: .6rem; background: #fff; color: #163b3a; font: inherit; }
.team-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.2rem; }
.team-heading h3 { margin:0; overflow-wrap:anywhere; } .team-heading p { margin-bottom:0; }
.team-picture { flex-shrink:0; display:grid; place-items:center; width:4rem; height:4rem; border-radius:50%; background:#d4f5f2 center / cover; color:#087a76; font-size:1.5rem; font-weight:800; }
.team-card { padding:1.3rem; border:1px solid #cbecec; border-radius:1rem; background:white; margin:1rem 0; min-width:0; }
.team-card .team-heading { justify-content:flex-start; } .team-card select, .assignment-row select { width:100%; padding:.7rem; font:inherit; border:1px solid #b8e7e7; border-radius:.6rem; background:white; color:#163b3a; }
.team-card > button { margin-top:.7rem; } .team-card .muted { font-size:.85rem; }
.team-roster { list-style:none; padding:0; } .team-roster li { display:flex; gap:.75rem; align-items:center; padding:.65rem 0; border-bottom:1px solid #e8f5f4; overflow-wrap:anywhere; }
.role-badge { display:inline-block; background:#e4fafa; color:#087a76; padding:.2rem .6rem; border-radius:1rem; font-size:.75rem; white-space:nowrap; }
.admin-team-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr)); gap:1rem; }
.create-team { display:flex; align-items:end; gap:.7rem; margin:1.5rem 0 .5rem; } .create-team label { flex:1; }
.assignment-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(8rem,1fr) auto; align-items:end; gap:.8rem; padding:1rem 0; border-bottom:1px solid #d9eeee; }
.assignment-row small { display:block; color:#6d8a89; overflow-wrap:anywhere; margin:.3rem 0; } .assignment-row strong { overflow-wrap:anywhere; }
.rename-team { max-width:26rem; margin-top:1.5rem; }
@media(max-width:720px) { .assignment-row { grid-template-columns:1fr; } .create-team { flex-direction:column; align-items:stretch; } .team-heading { flex-wrap:wrap; } }

.danger-button { display:block; margin-top:1rem; padding:.7rem 1rem; border:1px solid #e0aaaa; border-radius:.6rem; background:#fff7f7; color:#a12d2d; font-weight:700; }
.edit-user-name { margin-top:.8rem; gap:.5rem; }
/* Keep desktop navigation in view while long pages scroll independently. */
@media (min-width: 721px) {
  .signed-in .app-view { height: 100vh; height: 100dvh; min-height: 0; }
  .signed-in .sidebar, .signed-in .dashboard { min-height: 0; }
  .signed-in .dashboard { overflow-y: auto; }
  .signed-in .sidebar nav { min-height: 0; overflow-y: auto; flex-shrink: 1; }
  .signed-in .sidebar > .brand, .signed-in .profile-wrap { flex-shrink: 0; }
}

.logo-brand { display:flex; align-items:center; justify-content:center; width:fit-content; }
.logo-brand img { display:block; width:7rem; height:7rem; object-fit:contain; }
.sidebar > .logo-brand { align-self:center; }
@media (max-width:720px) { .sidebar > .logo-brand { display:flex; margin-right:auto; } .sidebar > .logo-brand img { width:3.5rem; height:3.5rem; } }

.weekly-progress { margin:2rem 0; padding:1.5rem; border:1px solid #cbecec; background:white; border-radius:1rem; }
.progress-summary { display:flex; justify-content:space-between; gap:1rem; margin-bottom:1rem; color:#176f70; }
.weekly-progress progress { display:block; width:100%; height:1.2rem; border:0; border-radius:1rem; overflow:hidden; appearance:none; background:#e1f4f2; }
.weekly-progress progress::-webkit-progress-bar { background:#e1f4f2; border-radius:1rem; }
.weekly-progress progress::-webkit-progress-value { background:#26bdb6; border-radius:1rem; }
.weekly-progress progress::-moz-progress-bar { background:#26bdb6; border-radius:1rem; }
.streak-card { display:flex; align-items:center; gap:1.5rem; padding:1.5rem; border:1px solid #f2dac0; border-radius:1rem; background:#fffaf3; }
.streak-flame { font-size:4rem; line-height:1.2; } .streak-card strong { font-size:2.5rem; color:#b86525; } .streak-card h3 { margin:.2rem 0; }
.delete-account-section { margin-top:3rem; padding-top:1.5rem; border-top:1px solid #e4baba; } .delete-account-section > h3 { color:#a12d2d; }
.delete-account-section details { max-width:32rem; } .delete-account-section summary { color:#a12d2d; cursor:pointer; font-weight:700; padding:.7rem 0; }
.delete-account-section form { margin-top:1rem; } .delete-confirmation { display:flex; align-items:flex-start; gap:.6rem; line-height:1.5; } .delete-confirmation input { width:auto; margin-top:.3rem; } .delete-account-section .danger-button { margin-top:0; }

.test-list { display:grid; gap:1rem; margin-top:2rem; } .test-card { margin:0; } .test-card h3 { margin:0 0 .3rem; color:#315b5a; font-size:1.1rem; } .test-card button { flex-shrink:0; } .weekly-test { background:#fff9e9; border-color:#e7d69f; margin:.5rem 0; } .weekly-test > span { background:#f9e9ad; color:#8b6a18; } .weekly-test .eyebrow { margin:0 0 .4rem; color:#8b6a18; font-size:.7rem; }

.star-controls { margin-top:1rem; padding-top:1rem; border-top:1px solid #d9eeee; gap:.6rem; } .star-actions { display:flex; flex-wrap:wrap; gap:.5rem; } .star-controls > strong { color:#87651a; } .podium .leader-avatar { position:relative; z-index:1; width:3.1rem; height:3.1rem; font-size:1.2rem; } .rank-row .team-picture { width:2rem; height:2rem; font-size:.85rem; } .podium strong, .rank-row strong { overflow-wrap:anywhere; } #leaderboard-content { margin-top:2rem; }
.admin-tabs { display:flex; flex-wrap:wrap; gap:.6rem; margin:1.5rem 0; } .admin-tabs [aria-pressed=true] { background:#c5f2f2; } #admin-unlock-form { max-width:24rem; margin-top:1.5rem; } .lock-toggle { display:flex; flex-direction:row; align-items:center; gap:.6rem; } .lock-toggle input { width:auto; } #admin-test-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr)); gap:1rem; } .quiz-form { margin:1.5rem 0; } .quiz-form fieldset { border:1px solid #cbecec; border-radius:.8rem; padding:1rem; } .quiz-form legend { font-weight:700; } .quiz-form label { display:flex; align-items:start; gap:.7rem; padding:.6rem 0; } .quiz-form input { width:auto; margin-top:.2rem; } #test-player { margin-top:1.5rem; }
/* Weekly completion and chained test locks. */
#progress-to-tests { margin-top:1.25rem; }
.unlock-message { margin:1.25rem 0 0; color:#087a76; font-size:clamp(1.1rem,3vw,1.6rem); font-weight:850; }
.celebrate-unlock { animation:weekly-celebration 1.2s ease-in-out 3; }
@keyframes weekly-celebration { 0%,100% { opacity:1; text-shadow:0 0 0 transparent; transform:scale(1); } 50% { opacity:.6; text-shadow:0 0 18px #30cfcf88; transform:scale(1.025); } }
.test-card { position:relative; min-height:190px; overflow:hidden; display:flex; align-items:flex-start; padding:1.5rem; transition:background-color .65s,color .65s,border-color .65s; isolation:isolate; }
.test-card .test-copy { position:relative; z-index:2; align-self:flex-start; }
.test-card .test-copy h3 { margin-bottom:.45rem; }
.test-card > button { align-self:flex-end; position:relative; z-index:2; }
.test-card.is-locked { background:#172b33; border-color:#38545e; color:#e6f3f5; }
.test-card.is-locked .test-copy h3 { color:#f3fbfc; }
.test-card.is-locked .test-copy p { color:#a8c0c9; max-width:65%; font-size:.8rem; }
.test-card.is-locked > button { visibility:hidden; }
.test-lock-cover { position:absolute; inset:0; z-index:3; pointer-events:none; }
.test-chains { position:absolute; inset:0; width:100%; height:100%; filter:drop-shadow(0 3px 2px #0007); }
.test-chains path { fill:none; stroke:#99acb3; stroke-width:8; stroke-dasharray:6 5; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.test-chains .chain-inner { stroke:#354851; stroke-width:3; }
.center-lock { position:absolute; left:50%; top:50%; translate:-50% -50%; width:72px; height:72px; border-radius:50%; background:#223c47; border:1px solid #647e88; box-shadow:0 6px 22px #0008; display:grid; place-items:center; font-size:2.5rem; z-index:2; }
.open-lock { display:none; }
.unlock-burst { position:absolute; left:50%; top:50%; width:10px; height:10px; border:3px solid #f9df89; border-radius:50%; translate:-50% -50%; opacity:0; }
.test-card.unlocking { animation:card-becomes-light 2.4s forwards; }
.unlocking .center-lock { animation:lock-shake-and-open 2.4s forwards; }
.unlocking .closed-lock { animation:closed-lock-away 2.4s forwards; }
.unlocking .open-lock { display:block; position:absolute; opacity:0; animation:open-lock-reveal 2.4s forwards; }
.unlocking .test-lock-cover { animation:unlock-cover-away 2.4s forwards; }
.unlocking .chain-nw, .unlocking .chain-sw { animation:chains-fall-left 2.4s forwards; }
.unlocking .chain-ne, .unlocking .chain-se { animation:chains-fall-right 2.4s forwards; }
.unlocking .unlock-burst { animation:lock-burst 2.4s forwards; }
@keyframes lock-shake-and-open { 0%,16%,32% { transform:rotate(0); } 4%,12%,20%,28% { transform:rotate(-14deg); } 8%,24% { transform:rotate(14deg); } 40% { transform:scale(1); } 48% { transform:scale(1.35); } 64% { transform:scale(1.1); opacity:1; } 100% { transform:translateY(100px) rotate(14deg) scale(.8); opacity:0; } }
@keyframes closed-lock-away { 0%,40%{opacity:1;} 43%,100%{opacity:0;} }
@keyframes open-lock-reveal { 0%,40%{opacity:0;} 43%,100%{opacity:1;} }
@keyframes chains-fall-left { 0%,43%{transform:translate(0,0);opacity:1;} 100%{transform:translate(-40px,220px) rotate(-18deg);opacity:0;} }
@keyframes chains-fall-right { 0%,43%{transform:translate(0,0);opacity:1;} 100%{transform:translate(40px,220px) rotate(18deg);opacity:0;} }
@keyframes lock-burst { 0%,40% { opacity:0;transform:scale(1); } 44% { opacity:1; } 75%,100% { opacity:0;transform:scale(20); } }
@keyframes unlock-cover-away { 0%,75% { opacity:1; } 100% { opacity:0; } }
@keyframes card-becomes-light { 0%,44%{background:#172b33;} 100%{background:#fff9e9;border-color:#e7d69f;} }
@media (prefers-reduced-motion:reduce) { .celebrate-unlock { animation:none; } .test-card { transition:none; } }
@media (max-width:480px) { .test-card { min-height:220px; flex-wrap:wrap; } .test-card .test-copy { flex-basis:100%; } }

#prototype-content > .test-card { margin-top:1rem; }
.test-history { margin-top:2rem; }
.test-history-row { display:grid; grid-template-columns:minmax(180px,2fr) minmax(170px,1.4fr) minmax(130px,1fr) auto; gap:1rem; align-items:center; padding:1rem 0; border-bottom:1px solid #cbecec; }
.test-history-row time { color:#526e70; font-size:.85rem; }
.score-pass { color:#13733b; } .score-fail { color:#b42318; }
.test-history-row a { color:#096c71; text-decoration:underline; }
#test-answer-key { margin-top:1.5rem; padding:1.5rem; background:#fff; border:1px solid #cbecec; border-radius:1rem; }
.answer-key-question { padding:1rem 0; border-bottom:1px solid #dbe8e8; } .answer-key-question p { white-space:pre-line; line-height:1.7; }
@media(max-width:760px) { .test-history-row { grid-template-columns:1fr; gap:.5rem; } }

.delete-result-dialog { width:min(92vw,440px); border:1px solid #cbecec; border-radius:1rem; padding:1.5rem; color:#244b4d; }
.delete-result-dialog::backdrop { background:#102c3a99; }
.delete-result-dialog form { display:grid; gap:1rem; }
.delete-result-dialog label { display:grid; gap:.5rem; }
.delete-result-dialog input { padding:.75rem; border:1px solid #87b4b4; border-radius:.5rem; }

.hero-card { align-items:center; }
.hero-card > div { min-width:0; }
.home-book-cover { display:block; width:clamp(130px,24%,210px); height:auto; object-fit:contain; flex-shrink:0; border-radius:.5rem; box-shadow:0 .6rem 1.3rem #0a44432b; }
@media(max-width:720px) { .home-book-cover { width:min(55%,190px); margin-inline:auto; } }
.team-discussion { margin-top:2rem; padding:clamp(1rem,3vw,1.5rem); border:1px solid #cbecec; border-radius:1rem; background:#fff; }
.team-post-form { display:grid; gap:.8rem; margin:1.5rem 0; } .team-post-form label { display:grid; gap:.5rem; }
.team-post-form textarea { box-sizing:border-box; width:100%; resize:vertical; padding:.8rem; border:1px solid #97bcbc; border-radius:.6rem; font:inherit; }
.team-post-form .announcement-toggle { display:flex; align-items:center; } .team-post-form .announcement-toggle[hidden] { display:none; }
.team-post-form button { justify-self:start; } .team-post { padding:1rem; border:1px solid #dceaea; border-radius:.7rem; margin:.7rem 0; overflow-wrap:anywhere; }
.team-post time { display:block; font-size:.8rem; color:#526e70; margin-top:.3rem; } .team-post p { white-space:pre-wrap; line-height:1.6; }
.captain-post { border-color:#d9c57c; background:#fffae9; }

.leaderboard-tabs { margin:1.5rem 0 1rem; } .leaderboard-tabs [aria-pressed="true"] { background:#147d7c; color:white; } .rank-row.my-ranking { background:#dff7f1; border:2px solid #21867b; border-radius:.6rem; }
/* Shared page palette: the sidebar teal fades gently darker toward the bottom. */
:root { --page-teal:#33cccc; --page-teal-bottom:#239d9f; }
.signed-in .app-view { background:var(--page-teal); }
.signed-in .sidebar { background:var(--page-teal); }
.signed-in .dashboard { background:linear-gradient(to bottom,var(--page-teal) 0%,#2ebcbd 50%,var(--page-teal-bottom) 100%); }
.hero-card { background:var(--page-teal); border:1px solid #bfdfdd; box-shadow:0 .4rem 1.2rem #276e6910; }

.signed-in .sidebar .nav-item { color:#123f40; }
.hero-card { border-color:#28b5b6; }
.signed-in .dashboard > .page-panel > .muted, .signed-in .dashboard .leaderboard-heading .muted, #ranking-description { color:#174d4e; }
/* Restore the pale page background independently of the sidebar and card. */
.signed-in .app-view { background:#e4fafa; }
.signed-in .dashboard { background:linear-gradient(to bottom,#e4fafa 0%,#dcf5f3 50%,#b8e2df 100%); }
/* Logo-inspired blue-green sidebar. */
.signed-in .sidebar { background:#449395; }
.signed-in .sidebar .nav-item { color:#f0fbfa; }
.signed-in .sidebar .nav-item:hover, .signed-in .sidebar .nav-item.active { background:#d1eeeb; color:#174d4e; }
/* Requested Home card and solid page background colors. */
.signed-in .app-view, .signed-in .dashboard { background:#e8f7f7; }
#home-page .hero-card { background:#9bd4d2; }

.my-team-ranking { position:sticky; bottom:0; z-index:4; margin-top:1rem; padding:.5rem 0; } .my-team-ranking .rank-row { box-shadow:0 -.2rem 1rem #174d4e18; }
#program-field select, #settings-program, #new-team-program { padding:.7rem; border:1px solid #bad5d5; border-radius:.6rem; font:inherit; }
body[data-program="zhifu"].signed-in .sidebar { background:#b88a2e; }
body[data-program="zhifu"].signed-in .app-view, body[data-program="zhifu"].signed-in .dashboard { background:#fff8e5; }
body[data-program="zhifu"] #home-page .hero-card { background:#f0d58e; border-color:#d9b15b; }
body[data-program="zhifu"] .sidebar .nav-item { color:#fffdf4; }
body[data-program="zhifu"] .sidebar .nav-item.active, body[data-program="zhifu"] .sidebar .nav-item:hover { background:#fff0c5; color:#674713; }
body[data-program="zhifu"] .primary, body[data-program="zhifu"] .secondary { border-color:#d5b063; color:#654819; }
body[data-program="zhifu"] .primary { background:#edc96f; }
body[data-program="zhifu"] .eyebrow, body[data-program="zhifu"] h2, body[data-program="zhifu"] h3 { color:#79571d; }
body[data-program="zhifu"] .test-card.is-locked h3 { color:#f3fbfc; }
body[data-program="zhifu"] .team-card, body[data-program="zhifu"] .weekly-progress, body[data-program="zhifu"] .team-discussion, body[data-program="zhifu"] .test-card:not(.is-locked) { border-color:#e0c994; background:#fffdf6; }
body[data-program="zhifu"] .rank-row.my-ranking { background:#fff0c5; border-color:#b98c34; }
body[data-program="zhifu"] .weekly-progress progress::-webkit-progress-value { background:#c99b36; }
body[data-program="zhifu"] .weekly-progress progress::-moz-progress-bar { background:#c99b36; }
body[data-program="zhifu"] .leaderboard-tabs [aria-pressed="true"] { background:#a87a27; color:white; }
body[data-program="zhifu"] .stat-grid span { color:#9b7228; }
body[data-program="zhifu"] .profile-avatar:not(.has-image) { background:#e9c976; color:#664817; }
.egg-card { margin:1.5rem 0; padding:1.5rem; border:1px solid #d5bf80; background:#fff9e7; border-radius:1rem; } .egg-card h3 { margin:0; } .egg-icon { display:inline-block; font-size:3.5rem; margin:.7rem 0; } .egg-card details { margin-top:1rem; } .egg-card li { line-height:1.8; } .egg-icon.rolling { animation:egg-wobble .4s infinite alternate; } @keyframes egg-wobble { from {transform:rotate(-12deg);} to {transform:rotate(12deg);} } @media(prefers-reduced-motion:reduce){.egg-icon.rolling{animation:none;}}
.egg-arcade { display:grid; grid-template-columns:minmax(260px,1fr) minmax(240px,1fr); gap:clamp(2rem,5vw,5rem); align-items:center; max-width:950px; margin:2.5rem auto; }
.capsule-machine { --machine:#368d90; --machine-dark:#256468; position:relative; width:min(100%,340px); margin:auto; padding-top:38px; filter:drop-shadow(0 18px 14px #174d4e20); }
.machine-sign { position:absolute; z-index:4; top:0; left:12%; width:76%; padding:15px 6px; text-align:center; background:#ffe4a0; border:5px solid var(--machine-dark); border-radius:20px; color:#71501a; font-size:18px; font-weight:900; letter-spacing:2px; }
.machine-globe { position:relative; height:235px; margin:0 17px; border:9px solid var(--machine-dark); border-radius:46% 46% 18% 18%; overflow:hidden; background:linear-gradient(140deg,#ffffffc9,#d7f9fa66 65%,#8dd3d4c0); box-shadow:inset 0 -10px 20px #2d7b7c20; }
.glass-shine { position:absolute; left:23px; top:32px; width:24px; height:92px; border-radius:50%; transform:rotate(22deg); background:#ffffff9c; }
.capsule-pile { position:absolute; inset:0; }
.mini-capsule { position:absolute; width:56px; height:65px; border-radius:50%; background:linear-gradient(to bottom,var(--cap,#eab252) 49%,#fff6dc 50%); border:2px solid #ffffffa6; box-shadow:2px 4px 5px #194c4c26; transform:rotate(var(--tilt,15deg)); }
.capsule-0{left:12%;bottom:7%;--cap:#d98582;--tilt:-30deg}.capsule-1{left:34%;bottom:2%;--cap:#8eadd9;--tilt:35deg}.capsule-2{left:58%;bottom:8%;--cap:#e8bf5e;--tilt:-20deg}.capsule-3{left:74%;bottom:19%;--cap:#a597cf;--tilt:55deg}.capsule-4{left:5%;bottom:32%;--cap:#91bda5;--tilt:-60deg}.capsule-5{left:27%;bottom:29%;--cap:#e8bf5e;--tilt:20deg}.capsule-6{left:48%;bottom:36%;--cap:#d98582;--tilt:75deg}.capsule-7{left:67%;bottom:46%;--cap:#86bec2;--tilt:15deg}.capsule-8{left:18%;bottom:53%;--cap:#a597cf;--tilt:-15deg}.capsule-9{left:39%;bottom:62%;--cap:#91bda5;--tilt:30deg}.capsule-10{left:62%;bottom:70%;--cap:#e8bf5e;--tilt:-45deg}.capsule-11{left:5%;bottom:74%;--cap:#8eadd9;--tilt:45deg}
.machine-body { position:relative; height:220px; background:linear-gradient(100deg,var(--machine-dark),var(--machine) 30%,var(--machine) 80%,var(--machine-dark)); border:7px solid var(--machine-dark); border-radius:22px 22px 28px 28px; margin-top:-20px; z-index:2; }
.machine-emblem { position:absolute; left:22px; top:20px; color:#ffe4a0; font-size:35px; }.machine-knob { position:absolute; left:50%; top:22px; width:66px; height:66px; margin-left:-33px; border-radius:50%; background:#ffe4a0; border:5px solid #ecd092; box-shadow:0 4px 0 #163c4055; }.machine-knob span { position:absolute; top:22px; left:4px; width:48px; height:12px; border-radius:6px; background:#8d713d; }.machine-slot { position:absolute; right:24px; top:40px; width:12px; height:34px; background:#163c40; border:3px solid #c6dede; border-radius:5px; }
.machine-chute { position:absolute; bottom:13px; left:24%; width:52%; height:87px; background:#153e42; border:6px solid #b9dada; border-radius:40px 40px 14px 14px; overflow:hidden; box-shadow:inset 0 6px 9px #0005; }.machine-door { position:absolute; inset:0; background:linear-gradient(#5ca3a6,#3b7b7d); border-radius:30px 30px 6px 6px; z-index:2; transform-origin:top; }
.dispensed-egg { position:absolute; width:48px; height:58px; left:calc(50% - 24px); bottom:3px; border-radius:50% 50% 44% 44%; background:linear-gradient(#f5c65c 48%,#fff7e0 49%); border:2px solid #ffecc1; opacity:0; transform:translateY(-100px); display:grid; place-items:center; color:#a87321; font-size:21px; box-shadow:0 3px 8px #0004; }.machine-base { height:20px; margin:-5px -6px 0; border-radius:8px; background:var(--machine-dark); }
.egg-control { padding:1.8rem; border:1px solid #c2d9d5; border-radius:1.5rem; background:#ffffffb8; }.egg-control #egg-balance { font-size:1.15rem; font-weight:750; }.egg-control #egg-roll { width:100%; padding:1rem; font-size:1rem; }.egg-prize { min-height:85px; display:grid; align-items:center; margin:1rem 0; padding:.75rem; border-radius:.8rem; text-align:center; }.egg-prize.revealed { background:#fff0bd; color:#745019; font-size:1.3rem; font-weight:800; animation:prize-pop .35s ease-out; }.egg-control details { border-top:1px solid #ccdcd7; padding-top:1rem; }.egg-control li { line-height:1.8; }
.mixing .mini-capsule { animation:capsule-jiggle .28s infinite alternate; }.mixing .mini-capsule:nth-child(even){animation-direction:alternate-reverse}.mixing .machine-knob { animation:knob-turn .9s linear infinite; }.dispensing .machine-knob { transform:rotate(180deg); }.dispensing .machine-door { animation:chute-open .4s forwards; }.dispensing .dispensed-egg { animation:egg-dispense 1.6s .2s both; }.opened .dispensed-egg { box-shadow:0 0 22px #ffd86c; }
@keyframes capsule-jiggle { to { transform:translateY(-9px) rotate(calc(var(--tilt,15deg) + 14deg)); } } @keyframes knob-turn { to {transform:rotate(360deg);} } @keyframes chute-open { to {transform:rotateX(88deg);} } @keyframes egg-dispense { 0%{opacity:0;transform:translateY(-100px) rotate(-25deg)} 12%{opacity:1} 65%{opacity:1;transform:translateY(0) rotate(12deg)} 80%{opacity:1;transform:translateY(-15px) rotate(-8deg)} 100%{opacity:1;transform:translateY(0) rotate(0)} } @keyframes prize-pop { from {transform:scale(.93);opacity:.5} to {transform:scale(1);opacity:1} }
body[data-program="zhifu"] .capsule-machine { --machine:#d0a448;--machine-dark:#94712b; }
@media(max-width:800px){.egg-arcade{grid-template-columns:1fr;gap:1.5rem}.capsule-machine{width:min(100%,300px)}.egg-control{padding:1.2rem}}
@media(prefers-reduced-motion:reduce){.mixing .mini-capsule,.mixing .machine-knob,.dispensing .machine-door,.dispensing .dispensed-egg,.egg-prize.revealed{animation:none}.dispensing .machine-door{transform:rotateX(88deg)}.dispensing .dispensed-egg{opacity:1;transform:none}}
.confucius-dialog{box-sizing:border-box;width:min(420px,calc(100vw - 32px));max-height:90dvh;overflow:auto;border:2px solid #9bd4d2;border-radius:28px;padding:24px;text-align:center;background:#fffdf5;color:#305a59;box-shadow:0 24px 80px #183a3940;animation:confucius-pop .45s cubic-bezier(.2,.8,.3,1.2)}
.confucius-dialog::backdrop{background:#163b3966}.confucius-dialog img{display:block;width:200px;max-width:75%;height:auto;margin:0 auto}.confucius-dialog h2{font-size:1.5rem;line-height:1.5;margin:12px 0 22px}.confucius-dialog button{min-width:120px}
@keyframes confucius-pop{from{opacity:0;transform:translateY(40px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.confucius-dialog{animation:none}}

/* Garden growth: sky, circular tree portrait and cumulative XP. */
.garden-hero{position:relative;isolation:isolate;display:flex;align-items:center;gap:30px;min-height:320px;padding:24px 28px;background:#fff;border:1px solid #d9e3e7;border-radius:20px;overflow:hidden;margin:24px 0 18px}
.garden-sky{position:absolute;inset:0 0 auto;height:42%;z-index:-1;background:linear-gradient(135deg,#229aca,#67c7e8)}
.garden-tree{width:260px;height:260px;flex:none;object-fit:contain;border-radius:50%;background:#d9f2fc}
.garden-detail{flex:1;min-width:0;padding-top:70px}
.garden-bar{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:66px;padding:12px 16px;border:2px solid #d0d7db;background:#fff;box-shadow:inset 0 0 0 2px #fff;overflow:hidden}
.garden-fill{position:absolute;left:2px;top:2px;bottom:2px;z-index:-1;background:#a9ddf5;max-width:calc(100% - 4px);transition:width .5s ease-out}
.garden-bar strong{font-size:clamp(1.1rem,2vw,1.65rem);color:#163e54;white-space:nowrap}.garden-bar span{font-size:1rem;color:#163e54;text-align:right}
.garden-xp{margin:12px 0 0;font-size:1.1rem;color:#315a6e;font-weight:650}.garden-earned{font-size:1.1rem;font-weight:700}.garden-note{color:#54706f;line-height:1.6}
.garden-stages{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;padding:0;margin:18px 0}
.garden-stage{display:flex;align-items:center;flex-direction:column;gap:8px;text-align:center;border:1px solid #d6e5e3;border-radius:16px;padding:14px 6px;background:white}.garden-stage img{width:86px;height:86px;max-width:100%;object-fit:contain;border-radius:50%}.garden-stage strong{font-size:1rem}.garden-stage span,.garden-stage small{font-size:.875rem;color:#4e6d6b}.garden-stage.current{border:2px solid #2499c9;background:#edf9ff}.garden-stage.locked img{opacity:.6}
@media(max-width:1100px){.garden-hero{gap:18px;padding:20px}.garden-tree{width:190px;height:190px}.garden-stages{grid-template-columns:repeat(3,minmax(0,1fr))}.garden-bar{flex-wrap:wrap}.garden-detail{padding-top:55px}}
@media(max-width:600px){.garden-hero{flex-direction:column;gap:10px;padding:18px;min-height:0}.garden-tree{width:190px;height:190px}.garden-detail{padding-top:0;width:100%}.garden-bar strong{font-size:1.15rem}.garden-stages{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.garden-fill{transition:none}}

.sidebar-icon{display:block;width:24px;height:24px;flex:0 0 24px;overflow:visible}

/* Icon details follow the selected program theme. */
body[data-program="zhifu"] .sidebar-icon[stroke="#397f9f"],
body[data-program="zhifu"] .sidebar-icon [stroke="#397f9f"]{stroke:#79571d}

.home-star-balance{display:flex;align-items:center;gap:16px;padding:18px 22px;border:1px solid #b8dcd8;border-radius:16px;background:#f7fffe;margin:20px 0 0}.home-star-balance>span{font-size:2.4rem}.home-star-balance p{margin:0 0 4px;color:#54706f}.home-star-balance strong{font-size:2rem;line-height:1.2;color:#174d4e;overflow-wrap:anywhere}.home-star-balance button{margin-left:auto}body[data-program="zhifu"] .home-star-balance{background:#fffdf4;border-color:#e0c994}body[data-program="zhifu"] .home-star-balance strong{color:#79571d}@media(max-width:420px){.home-star-balance{gap:10px;padding:14px}.home-star-balance strong{font-size:1.6rem}}

/* Logo-inspired landscape across all member pages. */
.signed-in .dashboard{background-color:#effafa;background-image:linear-gradient(rgba(255,255,255,.70),rgba(255,255,255,.70)),url('/assets/home-landscape.png');background-size:cover;background-position:center bottom;background-repeat:no-repeat}
#home-page{padding-bottom:180px}
#home-page .hero-card{background:#d9eeebdf;border:1px solid #b8dcd8}
#home-page .home-star-balance,#home-page .stat-grid article{background:#ffffffdf}
body[data-program="zhifu"].signed-in .dashboard{background-color:#fffaf0;background-image:linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,.55)),url('/assets/zhifu-reading-background-v2.png');background-size:cover;background-position:center bottom;background-repeat:no-repeat}
body[data-program="zhifu"] #home-page .hero-card{background:#f8e9bddd}
body[data-program="zhifu"] #home-page .home-star-balance,body[data-program="zhifu"] #home-page .stat-grid article{background:#fffdf3e8}
@media(max-width:600px){#home-page{padding-bottom:140px}.signed-in .dashboard{background-size:auto 100%;background-position:65% bottom}}

.egg-reveal-dialog{border:0;background:transparent;color:#fff;padding:0;width:min(92vw,560px);max-width:560px;overflow:visible;text-align:center}.egg-reveal-dialog::backdrop{background:#102334d9;backdrop-filter:blur(7px)}.egg-reveal-stage{position:relative;height:340px;display:grid;place-items:center}.crack-egg{position:relative;z-index:2;border:0;background:transparent;width:220px;height:270px;padding:0;cursor:pointer;filter:drop-shadow(0 12px 28px #ffdb8570)}.crack-egg:disabled{opacity:1;cursor:default}.crack-egg svg{width:100%;height:100%;overflow:visible}.shell-left,.shell-right{fill:url(#egg-shell);stroke:#bb8c44;stroke-width:2;transition:transform .8s ease,opacity .8s ease}.crack-one,.crack-two{fill:none;stroke:#785239;stroke-width:3;stroke-linejoin:round;opacity:0}.egg-reveal-dialog[data-cracks="1"] .crack-one,.egg-reveal-dialog[data-cracks="2"] .crack-one,.egg-reveal-dialog[data-cracks="2"] .crack-two{opacity:1}.egg-reveal-dialog.egg-open .shell-left{transform:translate(-90px,65px) rotate(-24deg);opacity:0}.egg-reveal-dialog.egg-open .shell-right{transform:translate(90px,65px) rotate(24deg);opacity:0}.egg-reveal-dialog[data-cracks="3"] .crack-egg{pointer-events:none}.egg-reward-art{position:absolute;inset:35px 50px;opacity:0;transition:opacity .5s .15s}.egg-reveal-dialog.egg-open .egg-reward-art{opacity:1}.egg-reward-art span{position:absolute;color:#ffdd65;-webkit-text-stroke:1px #d79428;text-shadow:0 0 14px #ffc947;animation:reward-star .65s both;animation-delay:var(--delay)}.egg-reveal-caption{display:flex;justify-content:center;align-items:center;gap:20px;min-height:72px;padding:16px;border-radius:20px;background:#102538e6}.egg-reveal-caption p{font-size:1.3rem;font-weight:750;margin:0}.egg-continue{flex-shrink:0}.egg-continue[hidden]{display:none}.mystic-reward{display:grid;place-items:center;isolation:isolate}.mystic-reward:before,.mystic-reward:after{content:"";position:absolute;inset:-25px;border-radius:50%;z-index:-1;background:conic-gradient(from 0deg,transparent,#57cfff99,transparent,#ba7cffbb,transparent,#ffe59aaa,transparent);filter:blur(13px);animation:mystic-turn 9s linear infinite}.mystic-reward:after{inset:20px;background:radial-gradient(ellipse,#fff6dccc,#9877ffa6 35%,#39bdfb66 55%,transparent 72%);animation:mystic-breathe 2.5s ease-in-out infinite alternate}.mystic-reward strong{font-size:clamp(24px,5vw,38px);color:#fff8d9;text-shadow:0 0 12px #ffd372,0 0 26px #ad8aff;animation:mystic-breathe 2.5s ease-in-out infinite alternate}@keyframes reward-star{from{transform:translateY(-75px) scale(.2);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes mystic-turn{to{transform:rotate(360deg)}}@keyframes mystic-breathe{to{transform:translateY(-8px) scale(1.04)}}@media(prefers-reduced-motion:reduce){.egg-reveal-dialog *,.egg-reveal-dialog *:before,.egg-reveal-dialog *:after{animation:none!important;transition:none!important}}@media(max-width:480px){.egg-reward-art{inset:35px 15px}.egg-reveal-caption{gap:12px;padding:12px}.egg-reveal-caption p{font-size:1.1rem}}

/* Shared capsule artwork and visible progressive cracks. */
.dispensed-egg{background:none;border:0;box-shadow:none;border-radius:0}.dispensed-egg svg{width:100%;height:100%;overflow:visible}.crack-egg .shell-left,.crack-egg .shell-right{stroke:none}.crack-egg .crack-one,.crack-egg .crack-two{stroke:#684019!important;stroke-width:5!important;fill:none!important;filter:drop-shadow(0 1px 1px #fff);pointer-events:none}.egg-shell-star{transition:opacity .25s}.egg-reveal-dialog.egg-open .egg-shell-star{opacity:0}

.egg-shell-remains{position:absolute;left:50%;bottom:-8px;width:min(400px,100%);height:140px;transform:translateX(-50%);z-index:50;overflow:visible;filter:drop-shadow(0 5px 5px #0005);pointer-events:none}

/* Rest the loose stars and shell on a shared ground plane. */
.egg-reward-art:has(.egg-shell-remains)::before{content:"";position:absolute;left:50%;bottom:-7px;width:min(52vw,790px);height:15px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#ffd77a38,transparent 70%);filter:blur(3px)}
.egg-reward-art:has(.egg-shell-remains)>span{filter:drop-shadow(0 3px 2px #0007)}

.egg-ground-fragment{position:absolute;display:block;width:32px;height:24px;z-index:30;transform:translateX(-50%);filter:drop-shadow(0 2px 2px #0008)}.egg-ground-fragment svg{display:block;width:100%;height:100%;transform:rotate(var(--fragment-angle)) scaleY(.6);transform-origin:50% 75%}

/* Keep the largest heaps inside the reveal and gently settle each star. */
@keyframes reward-star{0%{transform:translateY(-18px) scale(.85);opacity:0}65%{transform:translateY(2px) scale(1);opacity:1}100%{transform:translateY(0) scale(1);opacity:1}}
.egg-reward-art:has(.egg-shell-remains)::before{width:min(80vw,500px)}

/* Star-marked capsules tumble around the glass before dispensing. */
.mini-capsule::after{content:"★";position:absolute;inset:0;display:grid;place-items:center;color:#a87321;font-size:25px;font-style:normal;text-shadow:0 1px 1px #fff8}
.mixing .mini-capsule{animation:capsule-tumble 1.6s linear infinite;animation-delay:var(--roll-delay,0s)}
.mixing .mini-capsule:nth-child(even){animation-direction:reverse}
.capsule-0{--roll-delay:-0.000s}
.capsule-1{--roll-delay:-0.137s}
.capsule-2{--roll-delay:-0.274s}
.capsule-3{--roll-delay:-0.411s}
.capsule-4{--roll-delay:-0.548s}
.capsule-5{--roll-delay:-0.685s}
.capsule-6{--roll-delay:-0.822s}
.capsule-7{--roll-delay:-0.959s}
.capsule-8{--roll-delay:-1.096s}
.capsule-9{--roll-delay:-1.233s}
.capsule-10{--roll-delay:-1.370s}
.capsule-11{--roll-delay:-1.507s}
@keyframes capsule-tumble{0%{left:12%;bottom:12%;transform:rotate(0deg)}20%{left:5%;bottom:46%;transform:rotate(100deg)}40%{left:35%;bottom:64%;transform:rotate(200deg)}60%{left:72%;bottom:42%;transform:rotate(300deg)}80%{left:59%;bottom:5%;transform:rotate(400deg)}100%{left:12%;bottom:12%;transform:rotate(540deg)}}
@media(prefers-reduced-motion:reduce){.mixing .mini-capsule{animation:none}}

.mini-capsule{width:40px;height:48px}.mini-capsule::after{font-size:22px}.mixing .mini-capsule,.mixing .mini-capsule:nth-child(even){animation:none}

/* Use the same symmetrical oval proportions throughout the roll. */
.mini-capsule{border-radius:50%}.dispensed-egg{width:48px;height:58px}.crack-egg{width:220px;height:266px}

/* Decorative egg and machine artwork must not select on repeated taps. */
.crack-egg,.crack-egg *,.capsule-machine,.capsule-machine *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.crack-egg svg,.machine-emblem,.mini-capsule::after{pointer-events:none}

/* Start at rest in a supported pile, before any animation runs. */
.mini-capsule.capsule-0{left:calc(50% + -96px - 20px);bottom:0px;--tilt:-12deg}
.mini-capsule.capsule-1{left:calc(50% + -48px - 20px);bottom:0px;--tilt:8deg}
.mini-capsule.capsule-2{left:calc(50% + 0px - 20px);bottom:0px;--tilt:-7deg}
.mini-capsule.capsule-3{left:calc(50% + 48px - 20px);bottom:0px;--tilt:11deg}
.mini-capsule.capsule-4{left:calc(50% + 96px - 20px);bottom:0px;--tilt:-9deg}
.mini-capsule.capsule-5{left:calc(50% + -72px - 20px);bottom:43px;--tilt:14deg}
.mini-capsule.capsule-6{left:calc(50% + -24px - 20px);bottom:43px;--tilt:-13deg}
.mini-capsule.capsule-7{left:calc(50% + 24px - 20px);bottom:43px;--tilt:9deg}
.mini-capsule.capsule-8{left:calc(50% + 72px - 20px);bottom:43px;--tilt:-11deg}
.mini-capsule.capsule-9{left:calc(50% + -48px - 20px);bottom:86px;--tilt:-8deg}
.mini-capsule.capsule-10{left:calc(50% + 0px - 20px);bottom:86px;--tilt:12deg}
.mini-capsule.capsule-11{left:calc(50% + 48px - 20px);bottom:86px;--tilt:-10deg}

/* Frame each released trio together during its shared unlock celebration. */
.test-unlock-group{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:10px;height:min(72svh,570px);scroll-margin-block:20px}.test-unlock-group .test-card{min-height:0;height:100%;padding:12px 18px;flex-wrap:nowrap}.test-unlock-group .test-copy{flex:1;min-width:0}.test-unlock-group .test-copy h3{font-size:1rem}.test-unlock-group .test-copy p{margin:4px 0;font-size:.8rem}.test-unlock-group .test-card>button{padding:8px 12px}.test-unlock-group .center-lock{scale:.8}

.garden-growth-dialog{width:min(92vw,520px);padding:24px;border:1px solid #c8b3ef;border-radius:24px;text-align:center;background:#f4f0ff;overflow:hidden}.garden-growth-dialog::backdrop{background:#102038cc;backdrop-filter:blur(6px)}.garden-growth-stage{position:relative;width:min(100%,320px);aspect-ratio:1;margin:auto;isolation:isolate}.garden-growth-stage>img{width:100%;height:100%;object-fit:contain;border-radius:50%}.garden-growth-mist{position:absolute;inset:-20px;pointer-events:none;opacity:0;transition:opacity .6s;filter:blur(12px)}.growing .garden-growth-mist{opacity:1}.garden-growth-mist i{position:absolute;left:calc(10% + var(--i)*9%);bottom:5%;width:55%;height:55%;border-radius:50%;background:radial-gradient(circle,#fff4c9,#bb87ffb0 35%,#5bd8ef99 65%,transparent 75%);animation:garden-mist-rise 1.7s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-.19s)}.grown .garden-growth-mist{opacity:0;transition:opacity 1.2s .15s}.grown .garden-growth-stage>img{animation:garden-bloom .8s ease-out}.garden-growth-dialog .garden-xp{font-size:1.3rem;font-weight:800}@keyframes garden-mist-rise{from{transform:translate(-35%,10%) scale(.7)}to{transform:translate(-45%,-90%) scale(1.65)}}@keyframes garden-bloom{0%{transform:scale(.8);filter:brightness(2)}60%{transform:scale(1.08);filter:brightness(1.25)}100%{transform:scale(1);filter:brightness(1)}}@media(prefers-reduced-motion:reduce){.garden-growth-dialog *{animation:none!important;transition:none!important}}

/* Envelop the entire garden portrait before revealing its new stage. */
.garden-growth-mist{inset:-12%;z-index:3;filter:blur(9px);border-radius:45%;background:radial-gradient(ellipse at center,#f3e4ff 0%,#d7c1fa 38%,#b9e5f4 66%,#e8d7fdcc 79%,transparent 95%)}
.garden-growth-mist i{left:calc(-15% + var(--i)*10%);bottom:5%;width:90%;height:90%;background:radial-gradient(circle,#fff2d9 0%,#dabaff 35%,#a8ddf5dd 62%,transparent 78%);animation-name:garden-mist-envelop}
@keyframes garden-mist-envelop{from{transform:translate(-10%,15%) scale(.95)}to{transform:translate(-20%,-25%) scale(1.35)}}

/* Orbiting growth light continues circling as the new plant emerges. */
.garden-growth-mist{background:radial-gradient(ellipse,#f3e4ffee 0%,#d7c1fa99 48%,#b9e5f466 68%,transparent 84%);filter:blur(8px)}
.garden-growth-mist i{left:50%;top:50%;bottom:auto;width:78%;height:78%;animation:garden-light-orbit 2.8s linear infinite;animation-delay:calc(var(--i)*-.35s);background:radial-gradient(circle,#fff2d9ee 0%,#dabaffcc 35%,#a8ddf588 62%,transparent 78%)}
.grown .garden-growth-mist{opacity:0;transition:opacity 2.8s ease-out .15s}
@keyframes garden-light-orbit{from{transform:translate(-50%,-50%) rotate(0deg) translateX(24%)}to{transform:translate(-50%,-50%) rotate(360deg) translateX(24%)}}
@media(prefers-reduced-motion:reduce){.garden-growth-mist i{animation:none!important;transform:translate(-50%,-50%)}.grown .garden-growth-mist{transition:none!important}}

html[data-text-size="large"]{font-size:125%}#language-list{padding:10px 12px}#language-list summary{cursor:pointer}#language-list select{width:100%;margin-top:10px}#language-list .message:empty{display:none}

/* Extra-readable test questions in the Larger text setting. */
html[data-text-size="large"] .quiz-form legend{font-size:1.3rem;line-height:1.7;max-width:100%;overflow-wrap:anywhere}
html[data-text-size="large"] .quiz-form label{font-size:1.1rem;line-height:1.7}

#language-list{padding:0}#language-list summary{display:flex;align-items:center;gap:.5rem;padding:.65rem;border-radius:.45rem;color:#315b5a;list-style:none}#language-list summary::-webkit-details-marker{display:none}#language-list summary::after{content:'›';margin-left:auto}#language-list summary:hover{background:#e4fafa}#language-flyout{position:fixed;z-index:1000;width:190px;max-width:calc(100vw - 16px);padding:8px;background:#fff;border:1px solid #d8e6e6;border-radius:12px;box-shadow:0 10px 30px #183a3926}#language-flyout button{padding:12px;border-radius:8px;font-size:1rem}#language-flyout button[aria-pressed=true]{background:#e4fafa;color:#126d6d;font-weight:700}#language-list #settings-language{display:none}

.mention-options{max-height:180px;overflow-y:auto;background:#fff;border:1px solid #cbe0e4;border-radius:10px;padding:6px;box-shadow:0 8px 24px #173c3920}.mention-options[hidden]{display:none}.mention-options button{display:block;width:100%;border:0;border-radius:6px;padding:10px 12px;background:#fff;color:#315b5a;text-align:left;font:inherit}.mention-options button:hover,.mention-options button[aria-selected="true"]{background:#e4fafa}

.star-gain-toast{position:fixed;right:24px;top:24px;z-index:10000;padding:18px 26px;background:#fff9df;border:1px solid #efce71;border-radius:20px;font-size:1.6rem;box-shadow:0 10px 35px #765b2526;pointer-events:none}.flying-earned-star{position:fixed;z-index:10001;color:#efb724;font-size:24px;pointer-events:none}.completion-mark{width:40px;height:40px;vertical-align:middle}.completion-mark path{fill:none;stroke:#39a781;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;animation:completion-draw .7s ease-out}.profile-button.has-notification::after{content:"";width:9px;height:9px;border-radius:50%;background:#e9b632;box-shadow:0 0 8px #e9b632;position:absolute;right:8px;top:8px}.preview-bell{font-size:3rem}#preview-delight-stage{padding:24px;min-height:130px}.preview-program{padding:35px;background:linear-gradient(120deg,#dcf5fb,#fff1ca);border-radius:16px}@keyframes completion-draw{from{stroke-dashoffset:40}to{stroke-dashoffset:0}}@media(prefers-reduced-motion:reduce){.completion-mark path{animation:none}}

#global-star-balance{display:none;position:fixed;top:14px;right:20px;z-index:50;align-items:center;gap:8px;padding:10px 16px;border:1px solid #e6d394;border-radius:999px;background:#fffdf3;box-shadow:0 4px 16px #3d452018;color:#765f22;font-size:1.05rem;font-variant-numeric:tabular-nums;pointer-events:none}.signed-in #global-star-balance{display:flex}.signed-in .dashboard{padding-top:max(80px,4rem)}@media(max-width:720px){#global-star-balance{top:8px;right:12px;padding:7px 12px}.signed-in .sidebar{padding-top:56px}}

.egg-collection-balance{position:fixed;top:14px;right:20px;padding:10px 16px;border:1px solid #e6d394;border-radius:999px;background:#fffdf3;color:#765f22;font-size:1.05rem;font-weight:700;font-variant-numeric:tabular-nums;z-index:100}.egg-reveal-dialog .egg-reward-art{overflow:visible}@media(max-width:720px){.egg-collection-balance{top:8px;right:12px;padding:7px 12px}}

/* Each free roll has its own light; the reward label stays centered. */
.mystic-multiple::before,.mystic-multiple::after{display:none}
.mystic-multiple>strong{position:relative;z-index:2;animation:none;text-align:center}
.mystic-lights{position:absolute;inset:0;pointer-events:none}
.mystic-orbit{position:absolute;left:50%;top:50%;width:0;height:0}
.mystic-light{position:absolute;width:100px;height:100px;left:-50px;top:-50px;border-radius:50%;isolation:isolate}
.mystic-light::before,.mystic-light::after{content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(transparent,#57cfffcc,transparent,#ba7cffdd,transparent,#ffe59acc,transparent);filter:blur(9px);animation:mystic-turn 4s linear infinite}
.mystic-light::after{inset:12px;background:radial-gradient(circle,#fff6dccc,#9877ffa6 35%,#39bdfb66 55%,transparent 72%);animation:mystic-breathe 2.5s ease-in-out infinite alternate}
.mystic-count-2 .mystic-orbit:first-child{transform:translateX(-90px)}
.mystic-count-2 .mystic-orbit:last-child{transform:translateX(90px)}
.mystic-count-3 .mystic-light{width:80px;height:80px;left:-40px;top:-40px}
.mystic-count-3 .mystic-orbit{transform:rotate(var(--angle)) translateX(115px);animation:free-roll-orbit 9s linear infinite}
@keyframes free-roll-orbit{from{transform:rotate(var(--angle)) translateX(115px)}to{transform:rotate(calc(var(--angle) + 360deg)) translateX(115px)}}
@media(max-width:380px){.mystic-count-2 .mystic-orbit:first-child{transform:translateX(-75px)}.mystic-count-2 .mystic-orbit:last-child{transform:translateX(75px)}}
@media(prefers-reduced-motion:reduce){.mystic-orbit,.mystic-light::before,.mystic-light::after{animation:none!important}}

/* Larger oval free-roll lights, matching the original glow. */
.mystic-multiple .mystic-light{width:180px;height:230px;left:-90px;top:-115px;border-radius:50%}
.mystic-multiple .mystic-light::before{inset:-18px;background:conic-gradient(from 0deg,transparent,#57cfff99,transparent,#ba7cffbb,transparent,#ffe59aaa,transparent);filter:blur(13px);animation:mystic-turn 9s linear infinite}
.mystic-multiple .mystic-light::after{inset:20px;background:radial-gradient(ellipse,#fff6dccc,#9877ffa6 35%,#39bdfb66 55%,transparent 72%);filter:blur(13px)}
.mystic-count-2 .mystic-orbit:first-child{transform:translateX(-110px)}
.mystic-count-2 .mystic-orbit:last-child{transform:translateX(110px)}
.mystic-count-3 .mystic-light{width:150px;height:190px;left:-75px;top:-95px}
@media(max-width:480px){.mystic-multiple .mystic-light{width:130px;height:180px;left:-65px;top:-90px}.mystic-count-2 .mystic-orbit:first-child{transform:translateX(-80px)}.mystic-count-2 .mystic-orbit:last-child{transform:translateX(80px)}.mystic-count-3 .mystic-light{width:120px;height:165px;left:-60px;top:-82.5px}}
@media(prefers-reduced-motion:reduce){.mystic-multiple .mystic-light::before{animation:none!important}}

/* Every bonus light uses the single-reward light's full dimensions. */
.mystic-multiple .mystic-orbit{width:100%;height:100%;left:0;top:0}
.mystic-multiple .mystic-light{width:100%;height:100%;left:0;top:0}
.mystic-multiple .mystic-light::before{inset:-25px}
.mystic-multiple .mystic-light::after{inset:20px}

.garden-hero{position:relative;overflow:hidden}.garden-ambience{position:absolute;inset:0;pointer-events:none;overflow:hidden}.garden-ambience i{position:absolute;left:calc(8% + var(--n)*8%);top:calc(12% + var(--n)*7%);animation-delay:calc(var(--n)*-.8s)}.garden-firefly{width:5px;height:5px;background:#fff4ad;border-radius:50%;box-shadow:0 0 10px #ffd955;animation:firefly-drift 5s ease-in-out infinite alternate}.garden-petal{width:9px;height:14px;background:#efafd6;border-radius:80% 20% 70% 30%;animation:petal-fall 7s linear infinite}.garden-tree{transform-origin:50% 95%;animation:tree-sway 6s ease-in-out infinite alternate}.comment-arrival{animation:comment-arrive .45s ease-out}.mention-flash{animation:mention-glow 2.5s ease-out}.podium-shimmer{position:relative;overflow:hidden}.podium-shimmer::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#ffe48c99 50%,transparent 75%);transform:translateX(-100%);animation:podium-sweep 1.5s ease-out}.preview-podium{padding:40px;font-size:3rem}.ambience-preview{position:relative;width:280px;height:280px;overflow:hidden}.ambience-preview img{width:100%;height:100%;object-fit:contain}
@keyframes firefly-drift{from{opacity:.25;transform:translate(-12px,12px)}to{opacity:1;transform:translate(20px,-18px)}}@keyframes petal-fall{from{transform:translate(-20px,-160px) rotate(0);opacity:0}20%{opacity:.8}to{transform:translate(45px,220px) rotate(240deg);opacity:0}}@keyframes tree-sway{from{transform:rotate(-.6deg)}to{transform:rotate(.6deg)}}@keyframes comment-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes mention-glow{from{background:#fff0ae;box-shadow:0 0 15px #ebbd5866}to{background:transparent;box-shadow:none}}@keyframes podium-sweep{to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.garden-tree,.garden-ambience i,.comment-arrival,.mention-flash,.podium-shimmer::after{animation:none!important}.garden-ambience{display:none}.mention-flash{outline:2px solid #dfbd68}}

#garden-page{position:relative;isolation:isolate;min-height:calc(100dvh - 130px)}#garden-page>.garden-ambience{inset:-24px;z-index:1;pointer-events:none}#garden-page>.garden-ambience .garden-firefly{animation-name:garden-page-drift;animation-duration:9s}#garden-page>.garden-ambience .garden-petal{opacity:.6;animation-duration:12s}@keyframes garden-page-drift{0%{opacity:.15;transform:translate(-35px,25px)}50%{opacity:.85;transform:translate(25px,-35px)}100%{opacity:.25;transform:translate(55px,40px)}}

.perfect-score-celebration{position:fixed;inset:0;z-index:10005;display:grid;place-items:center;background:#182d4344;pointer-events:none;font-size:clamp(100px,20vw,190px);font-weight:900;color:#ffe38b;text-shadow:0 0 25px #ffc63c;animation:perfect-shine 1.1s ease-out}.new-notification-toast{position:fixed;right:20px;top:78px;z-index:10003;background:#fffdf2;border:1px solid #d9c48b;border-radius:14px;padding:18px;box-shadow:0 8px 30px #183b3926;animation:comment-arrive .4s ease-out}.jackpot-preview{position:relative;height:220px}.jackpot-halo{position:absolute;left:50%;top:50%;width:230px;height:230px;border-radius:50%;pointer-events:none;background:conic-gradient(#ff7777,#ffe07c,#7ce8bf,#77bfff,#cb8dff,#ff7777);mask:radial-gradient(circle,transparent 50%,#000 58%,transparent 72%);animation:jackpot-expand 1.8s ease-out forwards;z-index:4}.team-welcome{animation:welcome-slide .7s ease-out}.maximum-garden{position:relative;animation:max-glow 3s ease-out}.maximum-leaves{position:absolute;inset:0;overflow:hidden;pointer-events:none}.maximum-leaves i{position:absolute;top:-20px;width:12px;height:19px;background:#efc752;border-radius:80% 20%;animation:golden-leaf 2.5s ease-in both}@keyframes perfect-shine{0%{opacity:0;transform:scale(.75)}30%{opacity:1;transform:scale(1.05)}75%{opacity:1}100%{opacity:0;transform:scale(1.1)}}@keyframes jackpot-expand{from{transform:translate(-50%,-50%) scale(.5);opacity:1}to{transform:translate(-50%,-50%) scale(2.4);opacity:0}}@keyframes welcome-slide{from{opacity:0;transform:translateX(-35px)}to{opacity:1;transform:none}}@keyframes max-glow{50%{filter:drop-shadow(0 0 15px gold)}}@keyframes golden-leaf{to{transform:translate(40px,420px) rotate(220deg);opacity:0}}@media(prefers-reduced-motion:reduce){.perfect-score-celebration,.new-notification-toast,.jackpot-halo,.team-welcome,.maximum-garden,.maximum-leaves i{animation:none!important}.maximum-leaves{display:none}}

.admin-ring{outline:3px solid #e4b63e!important;outline-offset:3px;border-radius:50%;box-shadow:0 0 10px #e7ba4655}.tester-ring{outline:3px solid #90d9ff!important;outline-offset:3px;border-radius:50%}#admin-nav{display:none!important}

.member-picture{width:36px;height:36px;min-width:36px;flex:0 0 36px;display:inline-flex;vertical-align:middle;margin-right:10px;background-size:cover;background-position:center;border-radius:50%;font-size:16px}.comment-author{display:flex;align-items:center;gap:2px;margin-bottom:6px}.comment-author strong{overflow-wrap:anywhere}

.answer-key-question p{white-space:pre-wrap}

.password-recovery-dialog{width:min(92vw,480px);border:1px solid #bbd7e0;border-radius:18px;padding:24px}.password-recovery-dialog::backdrop{background:#122b4588}.password-recovery-dialog form,.password-recovery-dialog label{display:grid;gap:12px}.password-recovery-dialog input{width:100%;box-sizing:border-box;margin:8px 0}.password-recovery-dialog button{margin-top:12px}

[data-presence-user]{position:relative;overflow:visible}.presence-light{position:absolute;right:-2px;bottom:-2px;width:11px;height:11px;border:2px solid white;border-radius:50%;background:#929ca8;box-shadow:0 0 0 1px #fff}.presence-light.active{background:#29b76c}

/* Photographic fire texture, with a larger wind-swept silhouette. */
.admin-ring{position:relative;isolation:isolate;overflow:visible!important;box-shadow:0 0 5px #ffe995,0 0 12px #d99c1766}
.admin-ring::before,.admin-ring::after{content:"";position:absolute;pointer-events:none;z-index:-1}
.admin-ring::before{width:170%;height:170%;left:-30%;top:-43.5%;border-radius:0;background:url('/assets/admin-flowing-fire.svg?v=podium-gold') center/100% 100% no-repeat;animation:none}
.admin-ring::after{inset:-7%;border-radius:50%;box-shadow:0 0 7px #f5c95488,0 -3px 9px #d99c1755;filter:blur(2px);animation:admin-fire-light 1.3s ease-in-out infinite alternate}
.admin-ring .presence-light{z-index:2}
@keyframes admin-fire-light{from{opacity:.5}to{opacity:.95}}
@media(prefers-reduced-motion:reduce){.admin-ring::before,.admin-ring::after{animation:none}.admin-ring::before{background-image:url('/assets/admin-gold-fire-static.svg')}}

.crack-egg .crack-one,.crack-egg .crack-two{opacity:1;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .3s ease,opacity .3s ease}
.egg-reveal-dialog[data-cracks="1"] .crack-one{stroke-dashoffset:35}
.egg-reveal-dialog[data-cracks="2"] .crack-one,.egg-reveal-dialog[data-cracks="3"] .crack-one{stroke-dashoffset:0}
.egg-reveal-dialog[data-cracks="2"] .crack-two{stroke-dashoffset:45}
.egg-reveal-dialog[data-cracks="3"] .crack-two{stroke-dashoffset:0}
.egg-reveal-dialog.egg-open .crack-one,.egg-reveal-dialog.egg-open .crack-two{opacity:0}
@media(prefers-reduced-motion:reduce){.crack-egg .crack-one,.crack-egg .crack-two{transition:none}}

body[data-program="zhifu"] .logo-brand img{border-radius:50%}

@media(max-width:600px){body[data-program="zhifu"].signed-in .dashboard{background-size:auto 100%;background-position:65% bottom;background-repeat:no-repeat}}

body[data-program="zhifu"] .egg-reward-art span,body[data-program="zhifu"] .wish-star,body[data-program="zhifu"] .flying-earned-star{-webkit-text-stroke:0;text-shadow:none}

currency-copy{display:contents}gold-coin{display:inline-block;width:1em;height:1em;vertical-align:-.12em;background:url('/assets/gold-coin.svg') center/contain no-repeat;flex-shrink:0}

body[data-program="zhifu"] .egg-reward-art>span{border-radius:50%;filter:drop-shadow(0 2px 1px #6d420988);text-shadow:none;-webkit-text-stroke:0}body[data-program="zhifu"] .egg-reward-art gold-coin{transform:scaleY(.68);box-shadow:0 3px 0 #bc790c,0 5px 0 #8c5707;border-radius:50%;background-color:#eeb727}body[data-program="zhifu"] .garden-sky{background:linear-gradient(140deg,#fff6d5,#eac166)}body[data-program="zhifu"] .garden-fill{background:linear-gradient(110deg,#b47b19,#f2cb64)}

/* Larger Company gallery: retain clear size progression at every viewport. */
body[data-program="zhifu"] .garden-stages{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
body[data-program="zhifu"] .garden-stage{padding:20px 12px;justify-content:flex-end;min-height:300px}
body[data-program="zhifu"] .garden-stage img{width:var(--company-size);height:var(--company-size);max-width:100%;object-fit:contain;opacity:1}
body[data-program="zhifu"] .garden-tree{width:340px;height:340px;animation:none}
@media(max-width:900px){body[data-program="zhifu"] .garden-stages{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-program="zhifu"] .garden-hero{flex-direction:column}body[data-program="zhifu"] .garden-detail{width:100%;padding-top:0}}
@media(max-width:600px){body[data-program="zhifu"] .garden-stages{gap:10px}body[data-program="zhifu"] .garden-stage{padding:14px 6px;min-height:220px}body[data-program="zhifu"] .garden-stage img{width:calc(var(--company-size)*.65);height:calc(var(--company-size)*.65)}body[data-program="zhifu"] .garden-tree{width:min(320px,75vw);height:auto}}

body[data-program="zhifu"] .garden-stage{--company-size:220px}