/* Compact goal discovery rail + level picker. Intentionally independent from roadmap CSS. */
.goal-discovery{
  display:grid;
  gap:9px;
  min-width:0;
  direction:rtl;
}
.goal-discovery-title{
  margin:0;
  padding-inline:2px;
  color:#1D325C;
  font-size:.96rem;
  line-height:1.45;
  font-weight:950;
  letter-spacing:-.02em;
  text-align:right;
}
.goal-discovery-rail{
  display:flex;
  gap:10px;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  padding:2px 2px 5px;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}
.goal-discovery-rail::-webkit-scrollbar{display:none}
.goal-discovery-item{
  flex:0 0 82px;
  width:82px;
  display:grid;
  gap:6px;
  justify-items:center;
  align-content:start;
  color:#1D325C;
  text-decoration:none;
  scroll-snap-align:start;
  -webkit-tap-highlight-color:transparent;
}
.goal-discovery-art{
  width:82px;
  height:82px;
  border-radius:18px;
  overflow:hidden;
  display:block;
  background:#fff;
  border:1px solid #e4ecea;
  box-shadow:0 8px 18px rgba(15,23,42,.07), inset 0 0 0 1px rgba(255,255,255,.52);
}
.goal-discovery-art img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;
}
.goal-discovery-label{
  width:100%;
  overflow:hidden;
  color:#263956;
  font-size:.68rem;
  line-height:1.35;
  font-weight:900;
  text-align:center;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.goal-discovery-item:active .goal-discovery-art{transform:scale(.97)}
.goal-discovery-member{margin-top:1px}

/* Goal + starting level screen */
.goal-start-screen{
  gap:12px;
  padding-top:2px;
}
.goal-start-back{
  width:max-content;
  min-height:34px;
  padding:0 10px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#536178;
  background:#fff;
  border:1px solid #E5EAF0;
  text-decoration:none;
  font-size:.72rem;
  font-weight:850;
  box-shadow:0 6px 16px rgba(15,23,42,.04);
}
.goal-start-hero{
  position:relative;
  overflow:hidden;
  min-height:116px;
  padding:15px;
  border-radius:24px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 128px;
  gap:10px;
  align-items:center;
  background:linear-gradient(135deg,#fafdff 0%,#eefaf7 100%);
  border:1px solid #DFECEA;
  box-shadow:0 12px 28px rgba(15,23,42,.06);
  direction:rtl;
}
.goal-start-hero::after{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  left:-54px;
  bottom:-92px;
  border-radius:50%;
  background:rgba(23,179,159,.08);
  pointer-events:none;
}
.goal-start-hero-copy{display:grid;gap:3px;position:relative;z-index:1;text-align:right}
.goal-start-hero-copy>span{color:#0F8F74;font-size:.68rem;font-weight:900}
.goal-start-hero-copy h1{margin:0;color:#1D325C;font-size:1.25rem;line-height:1.4;font-weight:950;letter-spacing:-.03em}
.goal-start-hero-art{
  position:relative;
  z-index:1;
  width:128px;
  height:88px;
  border-radius:19px;
  overflow:hidden;
  border:1px solid rgba(15,143,116,.10);
  background:#eaf7f4;
}
.goal-start-hero-art img{width:100%;height:100%;object-fit:cover;object-position:left center;display:block;transform:scale(1.04)}
.goal-level-section{display:grid;gap:10px}
.goal-level-head{display:flex;align-items:end;justify-content:space-between;gap:10px;padding:2px 2px 0}
.goal-level-head h2{margin:0;color:#172747;font-size:1.08rem;line-height:1.5;font-weight:950;letter-spacing:-.02em}
.goal-level-head small{color:#0F8F74;font-size:.62rem;line-height:1.4;font-weight:850;white-space:nowrap}
.goal-level-list{display:grid;gap:7px}
.goal-level-option,
.goal-placement-option{
  width:100%;
  min-height:56px;
  padding:8px 10px;
  border-radius:17px;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  direction:rtl;
  text-align:right;
  font-family:inherit;
  text-decoration:none;
  color:#1D325C;
  background:#fff;
  border:1px solid #E4EAF0;
  box-shadow:0 8px 18px rgba(15,23,42,.045);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.goal-level-option.is-recommended{
  border-color:rgba(23,179,159,.52);
  background:linear-gradient(135deg,#fff 0%,#F0FBF8 100%);
  box-shadow:0 9px 20px rgba(15,143,116,.08);
}
.goal-level-code{
  width:52px;
  height:40px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:#F2F6FA;
  color:#243B6B;
  font-size:.9rem;
  font-weight:950;
  direction:ltr;
}
.goal-level-option.is-recommended .goal-level-code{background:#DDF6F0;color:#0F8F74}
.goal-level-option strong{font-size:.82rem;line-height:1.45;font-weight:930}
.goal-level-option em{
  font-style:normal;
  min-height:25px;
  padding:0 8px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  color:#0F8F74;
  background:#E9F8F4;
  font-size:.57rem;
  font-weight:900;
  white-space:nowrap;
}
.goal-level-arrow{color:#9AA7B7;font-size:1.15rem;font-weight:850;line-height:1}
.goal-placement-option{
  margin-top:3px;
  background:linear-gradient(135deg,#FFFCF6 0%,#FFF 70%);
  border-color:#EEE3D3;
  grid-template-columns:44px minmax(0,1fr) auto;
}
.goal-placement-icon{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:13px;
  color:#A47024;
  background:#FFF4DC;
  font-size:1rem;
  font-weight:950;
}
.goal-placement-option>span:nth-child(2){display:grid;gap:1px}
.goal-placement-option strong{font-size:.78rem;font-weight:930;line-height:1.45}
.goal-placement-option small{color:#8A7555;font-size:.61rem;font-weight:800;line-height:1.4}
.goal-level-option:active,.goal-placement-option:active{transform:scale(.992)}

@media(max-width:370px){
  .goal-discovery-rail{gap:8px}
  .goal-discovery-item{flex-basis:74px;width:74px}
  .goal-discovery-art{width:74px;height:74px;border-radius:16px}
  .goal-discovery-label{font-size:.64rem}
  .goal-start-hero{grid-template-columns:minmax(0,1fr) 112px;min-height:108px;padding:13px}
  .goal-start-hero-art{width:112px;height:80px;border-radius:17px}
}

@media(prefers-reduced-motion:reduce){
  .goal-discovery-item:active .goal-discovery-art,.goal-level-option:active,.goal-placement-option:active{transform:none}
}

/* All-goals page: same visuals, no multi-select questionnaire. */
.goal-picker-screen{gap:12px;padding-top:2px}
.goal-picker-head{display:flex;align-items:center;justify-content:space-between;gap:10px;direction:ltr}
.goal-picker-head>div{display:grid;gap:2px;direction:rtl;text-align:right}
.goal-picker-head h1{margin:0;color:#172747;font-size:1.08rem;line-height:1.45;font-weight:950;letter-spacing:-.025em}
.goal-picker-head small{color:#718096;font-size:.62rem;font-weight:800}
.goal-picker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.goal-picker-card{
  min-width:0;
  overflow:hidden;
  border-radius:19px;
  display:grid;
  background:#fff;
  border:1px solid #E3EAF0;
  box-shadow:0 9px 20px rgba(15,23,42,.05);
  color:#1D325C;
  text-decoration:none;
  -webkit-tap-highlight-color:transparent;
}
.goal-picker-card.is-active{border-color:rgba(23,179,159,.44);box-shadow:0 9px 22px rgba(15,143,116,.07)}
.goal-picker-art{height:112px;overflow:hidden;background:#fff;display:grid;place-items:center;padding:7px}
.goal-picker-art img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.goal-picker-copy{min-height:45px;padding:7px 9px;display:flex;align-items:center;justify-content:space-between;gap:6px;direction:rtl}
.goal-picker-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.73rem;line-height:1.4;font-weight:930}
.goal-picker-copy small{flex:0 0 auto;min-height:22px;padding:0 6px;border-radius:999px;display:inline-flex;align-items:center;background:#EAF8F4;color:#0F8F74;font-size:.52rem;font-weight:900;white-space:nowrap}
.goal-picker-placement{min-height:48px;padding:0 12px;border-radius:16px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;background:#FFFCF7;border:1px solid #EEE4D6;color:#536178;text-decoration:none;font-size:.68rem;font-weight:850}
.goal-picker-placement strong{color:#A47024;font-size:.68rem;font-weight:930}
.goal-picker-placement>span:last-child{font-size:1.05rem;color:#AAB3BF}
@media(max-width:350px){.goal-picker-art{height:102px}.goal-picker-copy{padding-inline:7px}.goal-picker-copy strong{font-size:.68rem}}

/* v2: clearer horizontal-scroll affordance without making the rail visually heavy. */
.goal-discovery-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding-inline:2px;
}
.goal-discovery-head .goal-discovery-title{padding-inline:0}
.goal-discovery-scroll-cue{
  flex:0 0 auto;min-width:38px;height:25px;padding:0 7px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;gap:3px;direction:ltr;
  color:#0f8f74;background:linear-gradient(135deg,#eef9f6,#fff);border:1px solid #d8ebe6;
  box-shadow:0 6px 14px rgba(15,143,116,.07);font-size:.74rem;font-weight:950;
}
.goal-discovery-scroll-cue i{width:10px;height:3px;display:block;background:radial-gradient(circle,#8cc9bd 1.2px,transparent 1.4px) 0 50%/5px 3px repeat-x;opacity:.85}
.goal-discovery-scroll-cue b{font-size:.85rem;line-height:1;animation:goalRailCue 1.8s ease-in-out 2}
@keyframes goalRailCue{0%,100%{transform:translateX(0)}50%{transform:translateX(-3px)}}
.goal-discovery-art img[src*="display-name-avatar"]{object-position:center;transform:scale(1.02);background:#fff8e9}
@media(prefers-reduced-motion:reduce){.goal-discovery-scroll-cue b{animation:none}}

/* v3: home goal rail as a real card with a familiar edge-peek scroll affordance. */
.goal-discovery-home-card{
  position:relative;
  overflow:hidden;
  gap:10px;
  padding:12px 12px 10px;
  border-radius:24px;
  background:linear-gradient(145deg,#fff 0%,#fbfdfd 100%);
  border:1px solid #E3EAF0;
  box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.goal-discovery-home-card .goal-discovery-head{
  padding:0 2px;
}
.goal-discovery-home-card .goal-discovery-title{
  font-size:.94rem;
}
.goal-discovery-viewport{
  position:relative;
  min-width:0;
  overflow:hidden;
  margin-inline:-2px;
}
.goal-discovery-home-card .goal-discovery-rail{
  gap:10px;
  padding:2px 2px 5px;
  scroll-snap-type:x mandatory;
}
.goal-discovery-edge-cue{
  position:absolute;
  z-index:3;
  left:0;
  top:0;
  bottom:0;
  width:46px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-left:4px;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.90) 38%,rgba(255,255,255,0) 100%);
}
.goal-discovery-edge-cue b{
  width:28px;
  height:28px;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(135deg,#17B39F,#0F8F74);
  box-shadow:0 8px 18px rgba(15,143,116,.22);
  font-size:1.15rem;
  line-height:1;
  font-weight:950;
  animation:goalRailEdgeCue 1.8s ease-in-out 3;
}
@keyframes goalRailEdgeCue{
  0%,100%{transform:translateX(0)}
  50%{transform:translateX(-4px)}
}
.goal-discovery-home-card .goal-discovery-item:last-child{
  margin-left:4px;
}
.goal-discovery-home-card.goal-discovery-member{margin-top:0}

@media(max-width:430px){
  .goal-discovery-home-card{padding:11px 10px 9px;border-radius:22px}
  .goal-discovery-home-card .goal-discovery-title{font-size:.9rem}
  .goal-discovery-edge-cue{width:42px}
  .goal-discovery-edge-cue b{width:26px;height:26px;font-size:1.05rem}
}
@media(prefers-reduced-motion:reduce){
  .goal-discovery-edge-cue b{animation:none}
}
.goal-discovery-edge-cue{transition:opacity .18s ease,transform .18s ease}
.goal-discovery-edge-cue.is-hidden{opacity:0;transform:translateX(-6px)}

/* 2026-08-18 · goal picker image-fit hardening: never crop portrait goal artwork. */
.goal-picker-art{
  height:142px;
  padding:6px 8px;
  overflow:hidden;
  background:linear-gradient(180deg,#fff 0%,#fbfdfd 100%);
}
.goal-picker-art img{
  width:auto !important;
  max-width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:none !important;
}
@media(max-width:350px){.goal-picker-art{height:130px;padding:5px 7px}}

/* 2026-08-18 · v6.7: portrait goal artwork must touch top/bottom, never crop sides. */
.goal-picker-art{
  height:142px !important;
  padding:0 12px !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:stretch !important;
  justify-content:center !important;
  background:#fff !important;
}
.goal-picker-art img{
  display:block !important;
  height:100% !important;
  width:auto !important;
  max-width:88% !important;
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
  margin:0 auto !important;
  align-self:stretch !important;
}
@media(max-width:350px){
  .goal-picker-art{height:130px !important;padding-inline:10px !important}
  .goal-picker-art img{max-width:90% !important}
}