.hero {
  min-height: 282px;
  padding-bottom: 46px;
}

.hero h1 {
  font-size: 37px;
  letter-spacing: -.055em;
}

.hero-portrait-stack {
  min-height: 185px;
}

.portrait {
  object-fit: contain;
  object-position: center bottom;
  background: #fff3a8;
}

.portrait-back {
  width: 82px;
  height: 82px;
  right: -7px;
  top: 4px;
  padding: 3px;
  z-index: 2;
}

.portrait-front {
  width: 124px;
  height: 124px;
  right: 34px;
  bottom: 18px;
  padding: 5px;
  z-index: 1;
}

.hero-slogan {
  position: absolute;
  right: 18px;
  bottom: 15px;
  z-index: 5;
  margin: 0;
  text-align: right;
  color: #6c5900;
  font-size: 10px;
  line-height: 1.45;
  letter-spacing: .04em;
}

.hero-slogan b {
  color: #2a2616;
  font-size: 11px;
}

.teacher-card img {
  height: 148px;
  object-fit: contain;
  object-position: center bottom;
  padding: 10px 20px 0;
  background: #fff3a8;
}

.assistant-avatar {
  object-fit: contain;
  object-position: center bottom;
  padding: 5px;
  background: #fff3a8;
}

@media (max-width: 360px) {
  .hero {
    min-height: 302px;
    padding-bottom: 52px;
  }

  .hero h1 {
    font-size: 31px;
  }

  .portrait-back {
    width: 76px;
    height: 76px;
    right: -6px;
    top: 3px;
  }

  .portrait-front {
    width: 110px;
    height: 110px;
    right: 28px;
    bottom: 27px;
  }

  .teacher-card img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px 7px 0;
  }
}

.growth-page {
  background: linear-gradient(180deg, #fffdf4 0, #fff 260px);
}

.page-title-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.page-title-row .eyebrow {
  margin-bottom: 5px;
}

.page-title-row .page-title {
  margin-bottom: 9px;
}

.page-share-button {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  margin-bottom: 9px;
  place-items: center;
  border: 1px solid #e6d57b;
  border-radius: 50%;
  background: #fff8cb;
  cursor: pointer;
}

.page-share-button svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: #1e211e;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.checkin-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  padding: 18px;
  border-radius: 24px;
  color: #fff;
  background: #191c19;
  box-shadow: 0 14px 35px rgba(20, 20, 15, .14);
}

.checkin-summary div span,
.checkin-summary div strong {
  display: block;
}

.checkin-summary div span {
  margin-bottom: 5px;
  color: #bbbdb8;
  font-size: 12px;
}

.checkin-summary div strong {
  color: #ffdc2f;
  font-size: 27px;
}

.checkin-summary div small {
  color: #fff;
  font-size: 12px;
}

.checkin-summary button {
  grid-column: 1 / -1;
  min-height: 48px;
  margin-top: 8px;
  border: 0;
  border-radius: 14px;
  background: #ffda24;
  color: #171717;
  font-size: 15px;
  font-weight: 900;
}

.week-card,
.points-section,
.rank-list {
  margin-top: 13px;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
}

.panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.panel-title span,
.panel-title strong {
  display: block;
}

.panel-title span {
  color: #9b7b00;
  font-size: 12px;
}

.panel-title strong {
  margin-top: 3px;
  font-size: 16px;
}

.panel-title > b {
  color: #c29100;
  font-size: 18px;
}

.panel-title button {
  border: 0;
  background: transparent;
  color: #9b7b00;
}

.week-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  margin-top: 18px;
}

.week-days div {
  text-align: center;
}

.week-days i,
.week-days b,
.week-days span {
  display: block;
  font-style: normal;
}

.week-days i {
  color: #8e8b82;
  font-size: 11px;
}

.week-days b {
  display: grid;
  width: 31px;
  height: 31px;
  margin: 6px auto;
  place-items: center;
  border-radius: 50%;
  background: #f3f2ed;
  font-size: 12px;
}

.week-days span {
  color: #a49f93;
  font-size: 9px;
}

.week-days .done b {
  background: #222622;
  color: #ffda24;
}

.week-days .today b {
  box-shadow: 0 0 0 4px #fff1a5;
  background: #ffda24;
}

.point-row,
.rank-row {
  display: grid;
  align-items: center;
  gap: 11px;
  padding: 14px 0;
  border-bottom: 1px solid #efede7;
}

.point-row {
  grid-template-columns: 40px 1fr auto;
}

.point-row:last-child,
.rank-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.point-row i,
.rank-row i {
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: #fff3aa;
  color: #322900;
  font-style: normal;
  font-weight: 900;
}

.point-row i {
  width: 40px;
  height: 40px;
}

.point-row strong,
.point-row span {
  display: block;
}

.point-row strong {
  font-size: 14px;
}

.point-row span {
  margin-top: 4px;
  color: #99958b;
  font-size: 11px;
}

.point-row > b {
  color: #bd8f00;
}

.rank-filter {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  margin-bottom: 12px;
}

.rank-filter button {
  min-height: 39px;
  border: 1px solid var(--line);
  border-radius: 99px;
  background: #fff;
  font-weight: 700;
}

.rank-filter .active {
  border-color: #20231f;
  background: #20231f;
  color: #ffdd31;
}

.my-rank-card {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 16px 7px;
  border-radius: 20px;
  background: linear-gradient(120deg, #ffda24, #fff3a7);
}

.my-rank-card div {
  text-align: center;
  border-right: 1px solid rgba(80, 64, 0, .16);
}

.my-rank-card div:last-child {
  border-right: 0;
}

.my-rank-card span,
.my-rank-card strong {
  display: block;
}

.my-rank-card span {
  margin-bottom: 5px;
  color: #756100;
  font-size: 10px;
}

.my-rank-card strong {
  font-size: 16px;
}

.podium {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1fr;
  align-items: end;
  gap: 7px;
  min-height: 218px;
  padding: 28px 10px 0;
}

.podium-item {
  position: relative;
  padding: 18px 4px 15px;
  border-radius: 18px 18px 7px 7px;
  text-align: center;
  background: #fff7c9;
}

.podium-item.first {
  padding-top: 29px;
  background: #ffdf42;
}

.podium-item.third {
  background: #f5eee1;
}

.podium-item > span {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 50%;
  background: #252825;
  color: #ffda24;
  font-size: 12px;
  font-weight: 900;
}

.podium-item > i {
  display: grid;
  width: 48px;
  height: 48px;
  margin: 0 auto 8px;
  place-items: center;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #fff;
  color: #826a00;
  font-style: normal;
  font-weight: 900;
  box-shadow: 0 5px 15px rgba(78, 58, 0, .12);
}

.podium-item strong,
.podium-item small {
  display: block;
}

.podium-item strong {
  font-size: 13px;
}

.podium-item small {
  margin-top: 4px;
  color: #7e796e;
  font-size: 10px;
}

.podium-item em {
  position: absolute;
  top: -39px;
  left: 50%;
  transform: translateX(-50%);
  color: #b07d00;
  font-size: 11px;
  font-style: normal;
  white-space: nowrap;
}

.rank-list {
  margin-top: 0;
}

.rank-row {
  grid-template-columns: 22px 40px 1fr auto;
}

.rank-row > b {
  color: #8f8b82;
  text-align: center;
}

.rank-row i {
  width: 40px;
  height: 40px;
}

.rank-row strong,
.rank-row span {
  display: block;
}

.rank-row strong {
  font-size: 14px;
}

.rank-row span {
  margin-top: 3px;
  color: #99958c;
  font-size: 10px;
}

.rank-row em {
  color: #655300;
  font-size: 13px;
  font-style: normal;
  font-weight: 900;
}

.rank-row.me {
  margin: 0 -8px;
  padding: 12px 8px;
  border: 0;
  border-radius: 15px;
  background: #fff7c7;
}

.share-demo-block {
  padding: 4px 15px 2px;
}

.share-demo-block .section-heading {
  padding: 18px 3px 9px;
}

.share-intro {
  margin: 0 3px 12px;
  color: #77736a;
  font-size: 13px;
  line-height: 1.55;
}

.share-demo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.share-demo-grid > button {
  min-width: 0;
  min-height: 138px;
  padding: 14px;
  border: 1px solid #e7dfc7;
  border-radius: 21px;
  background: linear-gradient(145deg, #fffdf3, #fff);
  text-align: left;
  cursor: pointer;
}

.share-demo-grid i {
  display: grid;
  width: 35px;
  height: 35px;
  margin-bottom: 12px;
  place-items: center;
  border-radius: 12px;
  background: #ffdf3d;
  color: #26220f;
  font-style: normal;
  font-weight: 900;
}

.share-demo-grid strong,
.share-demo-grid span,
.share-demo-grid b {
  display: block;
}

.share-demo-grid strong {
  font-size: 15px;
}

.share-demo-grid span {
  min-height: 35px;
  margin-top: 5px;
  color: #7c786f;
  font-size: 11px;
  line-height: 1.45;
}

.share-demo-grid b {
  margin-top: 8px;
  color: #a47d00;
  font-size: 12px;
}

body.sheet-open {
  overflow: hidden;
}

.share-sheet {
  position: fixed;
  inset: 0;
  z-index: 80;
}

.share-sheet-mask {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(16, 17, 15, .46);
  opacity: 0;
  transition: opacity .22s ease;
}

.share-sheet-panel {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: min(100%, 440px);
  margin: 0 auto;
  padding: 20px 18px 24px;
  border-radius: 28px 28px 0 0;
  background: #fffefb;
  box-shadow: 0 -18px 45px rgba(0, 0, 0, .16);
  transform: translateY(105%);
  transition: transform .22s ease;
}

.share-sheet.show .share-sheet-mask {
  opacity: 1;
}

.share-sheet.show .share-sheet-panel {
  transform: translateY(0);
}

.share-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.share-sheet-head span {
  color: #9a7900;
  font-size: 12px;
}

.share-sheet-head h2 {
  margin: 3px 0 0;
  font-size: 22px;
}

.share-sheet-close {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #f1f0eb;
  font-size: 24px;
}

.share-preview {
  margin: 16px 0;
  padding: 16px;
  border: 1px solid #edd56a;
  border-radius: 18px;
  background: linear-gradient(135deg, #ffdf3b, #fff5b8);
}

.share-preview span,
.share-preview strong {
  display: block;
}

.share-preview span {
  color: #7a6200;
  font-size: 11px;
}

.share-preview strong {
  margin-top: 5px;
  font-size: 19px;
}

.share-preview p {
  margin: 8px 0 0;
  color: #61572f;
  font-size: 12px;
  line-height: 1.5;
}

.share-channel-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.share-channel-grid button {
  min-width: 0;
  padding: 8px 2px;
  border: 0;
  background: transparent;
}

.share-channel-grid i {
  display: grid;
  width: 48px;
  height: 48px;
  margin: 0 auto 8px;
  place-items: center;
  border-radius: 16px;
  background: #202420;
  color: #ffdb2c;
  font-style: normal;
  font-weight: 900;
}

.share-channel-grid span {
  font-size: 11px;
}

.share-note {
  margin: 15px 0 0;
  color: #99958a;
  font-size: 11px;
  line-height: 1.5;
  text-align: center;
}

.poster-dialog{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:18px}.poster-dialog-mask{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(12,13,12,.7)}.poster-dialog-panel{position:relative;width:min(100%,420px);max-height:94vh;overflow:auto;padding:18px;border-radius:24px;background:#fffefb;box-shadow:0 25px 80px rgba(0,0,0,.28)}.poster-dialog-close{width:36px;height:36px;border:0;border-radius:50%;background:#f1f0eb;font-size:24px}.poster-dialog img{display:block;width:min(100%,320px);margin:16px auto;border-radius:15px;box-shadow:0 12px 35px rgba(37,30,10,.2)}.poster-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.poster-actions button{min-height:46px;border:1px solid #e5c339;border-radius:13px;background:#fff;font-weight:800}.poster-actions button:first-child{border-color:#ffd21a;background:#ffd21a}.poster-dialog[hidden]{display:none}.assistant-share-button,.case-share-button{border:1px solid #d9b300;border-radius:11px;background:#fff8c9;color:#5d4b00;font-weight:800}.assistant-share-button{width:100%;margin:0 0 12px;padding:10px}.case-share-button{margin-top:12px;padding:8px 11px}

@media (max-width: 360px) {
  .share-demo-grid {
    grid-template-columns: 1fr;
  }

  .share-demo-grid > button {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    align-items: center;
    gap: 10px;
    min-height: 92px;
  }

  .share-demo-grid i,
  .share-demo-grid b {
    margin: 0;
  }

  .share-demo-grid span {
    min-height: 0;
  }
}
.account-switch{display:grid;grid-template-columns:1fr auto;gap:4px 14px;align-items:center;margin:16px 0 18px;padding:15px 16px;border:1px solid #ebe4d7;border-radius:16px;background:#fff9d8;color:#151515}.account-switch span{font-size:12px;color:#8a7950}.account-switch strong{grid-column:1;font-size:15px}.account-switch>div{grid-column:2;grid-row:1/3;display:flex;gap:6px}.account-switch button{border:1px solid #dfc95c;border-radius:9px;padding:7px 9px;background:#fffdf1;color:#6c5700;font-size:11px;font-weight:800}.password-form[hidden]{display:none}.password-form{margin-bottom:18px}.password-form .form-section{background:#fffdf4}
.case-submit-entry{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 14px;padding:16px;border:0;border-radius:16px;background:#171a16;color:#fff;text-align:left}.case-submit-entry span{font-size:16px;font-weight:800}.case-submit-entry b{color:#ffd51c;font-size:12px}.case-form{margin-top:18px}.case-form-message{min-height:24px;margin:10px 0 0;color:#6d5a00;font-size:13px;text-align:center}.my-cases-block{margin-top:30px}.my-cases-block>h2{margin:0 0 12px;font-size:20px}.case-card-head{display:flex;align-items:center;justify-content:space-between}.case-status{padding:5px 9px;border-radius:999px;font-size:11px}.case-status.pending{color:#7e5e00;background:#fff1ad}.case-status.approved{color:#16603a;background:#dff5e8}.case-status.rejected{color:#8c332c;background:#ffe4e1}.case-feedback{margin-top:12px;padding:11px 12px;border-radius:12px;background:#f5f2eb}.case-feedback b{font-size:12px}.case-feedback p{margin:5px 0 0!important;font-size:13px!important}.notify-dot[hidden]{display:none}.message-card+.message-card{margin-top:12px}
.growth-grid button:last-child{grid-column:auto;min-height:112px;background:#fff}.performance-numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.performance-numbers label{min-width:0}.performance-card{border:1px solid var(--line);border-radius:18px;padding:15px;background:#fff;margin-bottom:10px}.performance-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.performance-card h3{margin:4px 0 12px;font-size:17px}.performance-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.performance-metrics div{padding:10px 6px;border-radius:11px;background:#f7f4ec;text-align:center}.performance-metrics span,.performance-metrics strong{display:block}.performance-metrics span{font-size:10px;color:#888}.performance-metrics strong{margin-top:4px;font-size:14px}.performance-card>p{margin:10px 0 0;color:#777;font-size:13px;line-height:1.55}
@media(max-width:360px){.performance-numbers{grid-template-columns:1fr}.growth-grid{grid-template-columns:1fr}.growth-grid button:last-child{min-height:90px}}
.credit-strip{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:10px;width:calc(100% - 28px);margin:10px 14px 12px;padding:11px 13px;border:1px solid #eadb8b;border-radius:15px;background:linear-gradient(120deg,#fffbe4,#fff2a1);color:#171a16;text-align:left}.credit-strip span{display:flex;align-items:center;gap:7px}.credit-strip i{display:grid;width:28px;height:28px;place-items:center;border-radius:9px;background:#171a16;color:#ffd929;font-style:normal;font-weight:900}.credit-strip span b{font-size:13px}.credit-strip>strong{font-size:19px}.credit-strip small{color:#7f6a17;text-align:right}.credit-balance-card{margin:18px 0;padding:24px;border-radius:22px;background:linear-gradient(135deg,#171a16,#343a32);color:#fff;box-shadow:0 16px 34px rgba(20,22,19,.16)}.credit-balance-card>span{color:#d7d9d4;font-size:12px}.credit-balance-card>strong{display:block;margin:10px 0 6px;font-size:18px}.credit-balance-card>strong b{color:#ffd928;font-size:40px}.credit-balance-card p{margin:0;color:#c8cbbf;font-size:12px}.credit-section{margin:16px 0;padding:17px;border:1px solid var(--line);border-radius:20px;background:#fff}.recharge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.recharge-grid button{min-width:0;padding:13px 5px;border:1px solid #ead47a;border-radius:13px;background:#fffbed}.recharge-grid strong,.recharge-grid span{display:block}.recharge-grid strong{font-size:13px}.recharge-grid span{margin-top:5px;color:#8b6a00;font-weight:800}.credit-note{margin:10px 0 0;color:#989386;font-size:11px;text-align:center}.invite-card{padding:20px;border-radius:22px;background:linear-gradient(135deg,#ffda28,#fff4aa)}.invite-card>span{font-size:11px;color:#816400}.invite-card h2{margin:5px 0 8px;font-size:21px}.invite-card p{margin:0;color:#655b32;font-size:13px;line-height:1.6}.invite-card>div{display:flex;justify-content:space-between;margin:14px 0 10px}.invite-card>div b,.invite-card>div small{font-size:12px}.invite-card button{width:100%;min-height:45px;border:0;border-radius:13px;background:#171a16;color:#ffd928;font-weight:900}.credit-row{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #eeeae0}.credit-row:last-child{border-bottom:0}.credit-row>i{display:grid;width:36px;height:36px;place-items:center;border-radius:11px;background:#f1eee7;color:#695d4d;font-style:normal;font-weight:900}.credit-row>i.income{background:#e4f5e9;color:#187043}.credit-row strong,.credit-row span{display:block}.credit-row strong{font-size:13px}.credit-row span{margin-top:3px;color:#999;font-size:10px}.credit-row>b{font-size:14px;color:#5a5144}.credit-row>b.income{color:#187043}
@media(max-width:360px){.credit-strip{grid-template-columns:auto 1fr}.credit-strip small{grid-column:1/-1;text-align:left}.recharge-grid{grid-template-columns:1fr}}

.goal-options{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}.tool-form .goal-options label{display:flex;align-items:center;gap:6px;padding:10px;border:1px solid #ded8ca;border-radius:12px;font-weight:normal}.tool-form .goal-options input{width:18px;height:18px;margin:0;accent-color:#e4ba00}.result-actions button:disabled{opacity:.45}

.record-full{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8;margin:12px 0}.record-card summary{cursor:pointer;padding:10px 0;font-weight:600}

.assistant-preview-label{display:inline-block;font-size:11px;line-height:1.5;padding:3px 8px;border-radius:999px;background:#fff2bd;color:#806400;margin-top:7px}.assistant-row strong{overflow-wrap:anywhere}.assistant-preview-card{margin:18px 0;padding:22px;border:1px solid #e9dfbf;border-radius:24px;background:linear-gradient(145deg,#fff9db,#fff)}.assistant-preview-card h2{font-size:21px}.assistant-preview-card li{margin:13px 0;line-height:1.6}.assistant-preview-card p{font-size:14px;line-height:1.8;color:#706958}.assistant-preview-card .primary-button{width:100%;margin-top:16px;opacity:.55;cursor:default}

.account-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;background:#fffef6;border-bottom:1px solid #eee5c9}.account-strip-info{min-width:0}.account-strip-info span,.account-strip-info strong,.account-strip-info small{display:block}.account-strip-info span{font-size:10px;color:#8a7954;margin-bottom:3px}.account-strip-info strong{font-size:14px;overflow-wrap:anywhere}.account-strip-info small{font-size:12px;color:#726e62;margin-top:3px}.account-strip>button{flex-shrink:0;border:1px solid #d6c59d;background:#fff;padding:9px 12px;border-radius:12px;font-size:12px;color:#3e382b;cursor:pointer}
