/* Kỳ Nam — emerald visual theme
   Loaded last so legacy module palettes share one calm, accessible identity. */
:root {
    --ink: #102a24;
    --muted: #61756e;
    --cream: #f6fbf8;
    --blue: #10a37f;
    --deep: #08745c;
    --coral: #e8913a;
    --yellow: #f4c95d;
    --mint: #65d6ad;
    --line: #dbe9e3;
    --nav-ink: #12352c;
    --nav-muted: #6b7e77;
    --nav-blue: #0f9f7b;
    --nav-deep: #08745c;
    --nav-coral: #e8913a;
}

body { background-color: #f6fbf8; color: var(--ink); }
::selection { background: #9be4c9; color: #073d30; }
:focus-visible { outline: 3px solid rgba(16,163,127,.3); outline-offset: 3px; }

/* Shared navigation */
.site-navbar { border-color: rgba(8,116,92,.12); background: rgba(247,252,249,.93); box-shadow: 0 8px 30px rgba(8,73,58,.045); }
.site-brand-mark,.brand-mark,.brand>span { background: #c8f1e2 !important; box-shadow: 0 5px 15px rgba(8,116,92,.16) !important; }
.site-nav-menu>a:hover { background: #e8f7f1; color: var(--nav-blue); }
.site-login { background: linear-gradient(135deg,#10a37f,#08745c); box-shadow: 0 8px 20px rgba(8,116,92,.22); }
.site-account-avatar,.account-avatar { background: #d8f3e9; color: #08745c; }
.site-nav-menu>.site-notification{position:relative;display:grid;width:38px;height:38px;flex:0 0 38px;padding:0!important;place-items:center;border:1px solid #d8e9e2;border-radius:50%!important;background:#eef8f4;color:#08745c}.site-notification i{font-size:.92rem}.site-notification>b{position:absolute;right:-5px;top:-6px;display:grid;min-width:19px;height:19px;padding:0 4px;place-items:center;border:2px solid #fff;border-radius:99px;background:#e15f68;color:#fff;font-size:.48rem;line-height:1}.site-nav-menu>.site-notification:hover{background:#dff3eb;transform:translateY(-1px)}
.site-account-menu { border-color: #dceae4; box-shadow: 0 20px 45px rgba(8,73,58,.15); }
.site-account-menu>a:hover,.account-menu .dropdown-item:hover { background: #eaf8f3; }
.site-nav-toggle>span:not(.visually-hidden) { background: #17604e; }
@media(max-width:1080px){.site-nav-menu{border-color:#dceae4;background:#fafffc}}
@media(max-width:1080px){.site-nav-menu>.site-notification{width:42px!important;height:42px;align-self:flex-end;margin:2px 3px 0}}

/* Home */
.hero { background: radial-gradient(circle at 80% 20%,#ccefe2 0 13%,transparent 13.2%),radial-gradient(circle at 93% 68%,#f7e5a9 0 8%,transparent 8.2%),linear-gradient(135deg,#f8fcfa,#e8f7f1 54%,#f4fbf7) !important; }
.hero{position:relative;min-height:535px!important;padding:6.25rem 0 3.4rem!important;background:linear-gradient(90deg,#f8fcfa 0%,#f8fcfa 43%,rgba(248,252,250,.94) 52%,rgba(232,247,241,.45) 67%,rgba(232,247,241,.08) 79%),url('../images/home-hero-portrait.jpg') right 10% center/auto 100% no-repeat,#e8f7f1!important}.hero .hero-visual{min-height:315px;opacity:0;pointer-events:none}.hero .hero-copy{position:relative;z-index:2}.hero h1{font-size:clamp(3rem,6vw,5.25rem)}
.nam-avatar { background: linear-gradient(145deg,#16ad86,#08745c) !important; box-shadow: inset -17px -20px 0 rgba(4,74,58,.14),0 25px 55px rgba(8,116,92,.23) !important; }
.eyebrow { background:#dff5ed !important; color:#08745c !important; }
.goals { background:#eaf7f2 !important; }
.challenges,footer { background:#073d30 !important; }
.challenge-card { background:#0d5543 !important; }
.together { background:linear-gradient(135deg,#e7f6ef,#f5edcf) !important; }
.btn-primary,.homecoming-button { border-color:#0f9f7b !important; background:linear-gradient(135deg,#10a37f,#08745c) !important; box-shadow:0 10px 23px rgba(8,116,92,.22) !important; }
@media(max-width:991px){.hero{min-height:500px!important;padding:5rem 0 3rem!important;background:linear-gradient(90deg,rgba(248,252,250,.98) 0%,rgba(248,252,250,.94) 58%,rgba(232,247,241,.68) 100%),url('../images/home-hero-portrait.jpg') right -75px center/auto 100% no-repeat,#e8f7f1!important}.hero .hero-visual{display:none}.hero .hero-copy{max-width:72%}}
@media(max-width:600px){.hero{min-height:470px!important;background:linear-gradient(90deg,rgba(248,252,250,.98),rgba(248,252,250,.88)),url('../images/home-hero-portrait.jpg') right -120px center/auto 100% no-repeat!important}.hero .hero-copy{max-width:100%}.hero h1{font-size:clamp(2.65rem,14vw,4rem)}}
.hero.hero-pro{position:relative;min-height:590px!important;padding:0!important;overflow:hidden;background:radial-gradient(circle at 80% 33%,rgba(82,208,163,.26),transparent 25%),radial-gradient(circle at 9% 90%,rgba(244,201,93,.18),transparent 18%),linear-gradient(125deg,#f9fdfb 0%,#eef9f4 56%,#dff3eb 100%)!important}.hero-pro:before{position:absolute;right:-9%;bottom:-47%;width:650px;height:650px;border:1px solid rgba(8,116,92,.12);border-radius:50%;content:''}.hero-grid-pattern{position:absolute;inset:0;opacity:.34;background-image:linear-gradient(rgba(8,116,92,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(8,116,92,.055) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(90deg,#000,transparent 72%)}.hero-pro-inner{position:relative;z-index:2;display:grid;min-height:590px;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);align-items:center;gap:32px}.hero-pro-copy{padding:65px 0 72px}.hero-overline{display:inline-flex;gap:9px;align-items:center;color:#226b57;font-size:.65rem;font-weight:800;letter-spacing:1.1px;text-transform:uppercase}.hero-overline i{display:block;width:28px;height:2px;background:#10a37f}.hero-pro h1{margin:17px 0 20px;color:#11382e;font-size:clamp(3.5rem,6.1vw,6rem)!important;font-weight:800;line-height:.91;letter-spacing:-5px}.hero-pro h1 em{position:relative;color:#0b8769;font-family:'Be Vietnam Pro',sans-serif;font-style:normal;letter-spacing:-5px}.hero-pro h1 em:after{position:absolute;left:2%;right:0;bottom:-8px;height:9px;border-radius:50%;background:#f4c95d;content:'';opacity:.72;transform:rotate(-1.5deg);clip-path:polygon(0 35%,100% 0,96% 66%,3% 100%)}.hero-intro{max-width:610px;margin:0;color:#5d746c;font-size:.86rem;line-height:1.8}.hero-actions{display:flex;gap:10px;margin-top:26px}.hero-primary,.hero-secondary{display:inline-flex;gap:14px;padding:12px 17px;border-radius:11px;align-items:center;color:#fff;font-size:.68rem;font-weight:800;text-decoration:none;transition:.2s}.hero-primary{background:#08745c;box-shadow:0 12px 25px rgba(8,116,92,.22)}.hero-primary span{font-size:1rem}.hero-primary:hover{color:#fff;transform:translateY(-2px);box-shadow:0 16px 30px rgba(8,116,92,.28)}.hero-secondary{border:1px solid #c7dfd6;background:rgba(255,255,255,.66);color:#275f50}.hero-secondary:hover{background:#fff;color:#08745c}.hero-proof{display:flex;gap:28px;margin-top:35px}.hero-proof>div{display:flex;gap:9px;align-items:center}.hero-proof strong{color:#0a654f;font-size:1.4rem;letter-spacing:-1px}.hero-proof span{color:#3c5e53;font-size:.57rem;font-weight:800;line-height:1.25;text-transform:uppercase}.hero-proof small{color:#8a9c95;font-size:.47rem;font-weight:500;text-transform:none}.hero-portrait-stage{position:relative;align-self:stretch;min-height:590px}.hero-portrait-stage img{position:absolute;z-index:3;right:3%;bottom:0;width:min(470px,100%);height:94%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 22px 26px rgba(14,72,57,.16))}.portrait-glow{position:absolute;right:7%;bottom:4%;width:390px;height:390px;border-radius:50%;background:linear-gradient(145deg,#7ad5b5,#08745c);box-shadow:0 35px 70px rgba(8,116,92,.2)}.portrait-ring{position:absolute;border:1px solid rgba(8,116,92,.23);border-radius:50%}.ring-one{right:0;bottom:1%;width:465px;height:465px}.ring-two{right:11%;bottom:12%;width:315px;height:315px;border-style:dashed}.portrait-note{position:absolute;z-index:4;padding:8px 11px;border:1px solid rgba(255,255,255,.8);border-radius:9px;background:rgba(255,255,255,.76);box-shadow:0 10px 25px rgba(16,66,53,.1);color:#174f40;font-size:.57rem;font-weight:800;letter-spacing:.5px;backdrop-filter:blur(8px)}.note-one{left:-3%;top:22%;transform:rotate(-4deg)}.note-two{right:-3%;top:35%;transform:rotate(5deg)}.note-three{left:1%;bottom:12%}.hero-scroll{position:absolute;z-index:5;left:28px;bottom:25px;display:flex;gap:8px;align-items:center;color:#789087;font-size:.5rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;transform:rotate(-90deg);transform-origin:left bottom}.hero-scroll span{display:block;width:25px;height:1px;background:#7ba99a}
@media(max-width:991px){.hero.hero-pro,.hero-pro-inner{min-height:535px!important}.hero-pro-inner{grid-template-columns:1.15fr .85fr}.hero-pro-copy{padding:55px 0}.hero-pro h1{font-size:clamp(3rem,7vw,4.5rem)!important;letter-spacing:-3px}.hero-pro h1 em{letter-spacing:-3px}.hero-portrait-stage{display:block!important;min-height:535px!important;opacity:1!important}.hero-portrait-stage img{right:-18%;width:125%;height:88%}.portrait-glow{right:-8%;width:330px;height:330px}.ring-one{right:-18%;width:390px;height:390px}.note-one,.note-three{display:none}.hero-proof{gap:14px}.hero-scroll{display:none}}
@media(max-width:700px){.hero.hero-pro{min-height:690px!important}.hero-pro-inner{display:block;min-height:690px!important}.hero-pro-copy{position:relative;z-index:5;padding:44px 0 0}.hero-pro h1{font-size:clamp(3rem,14vw,4.2rem)!important}.hero-intro{max-width:94%;font-size:.75rem}.hero-actions{flex-wrap:wrap}.hero-proof{display:none}.hero-portrait-stage{position:absolute;right:-13%;bottom:0;width:78%;min-height:360px!important;height:360px}.hero-portrait-stage img{right:0;width:100%;height:100%}.portrait-glow{right:0;bottom:-15%;width:280px;height:280px}.ring-one{right:-10%;bottom:-18%;width:330px;height:330px}.ring-two,.note-two,.note-three{display:none}}
/* Compact hero tuned for the resized portrait asset. */
.hero.hero-pro,.hero-pro-inner{min-height:500px!important}.hero-pro-copy{padding:42px 0 52px}.hero-portrait-stage{min-height:500px}.hero-portrait-stage img{height:96%;width:min(430px,100%)}.portrait-glow{width:335px;height:335px}.ring-one{width:400px;height:400px}.ring-two{width:275px;height:275px}.hero-pro h1{margin-block:12px 16px;font-size:clamp(3.2rem,5.45vw,5.25rem)!important}.hero-proof{margin-top:25px}
@media(max-width:991px){.hero.hero-pro,.hero-pro-inner{min-height:465px!important}.hero-pro-copy{padding:35px 0 42px}.hero-portrait-stage{min-height:465px!important}.hero-portrait-stage img{height:94%}.portrait-glow{width:290px;height:290px}.ring-one{width:345px;height:345px}}
@media(max-width:700px){.hero.hero-pro,.hero-pro-inner{min-height:610px!important}.hero-pro-copy{padding:34px 0 0}.hero-portrait-stage{min-height:315px!important;height:315px}.hero-portrait-stage img{height:100%;width:100%}.portrait-glow{width:245px;height:245px}.ring-one{width:290px;height:290px}}
/* Hero cinematic entrance: silhouette sweep → flash → portrait → copy. */
.hero-pro{isolation:isolate}.hero-portrait-stage:before{position:absolute;z-index:5;right:3%;bottom:0;width:min(430px,100%);height:96%;background:url('../images/home-hero-portrait-cutout.png') center bottom/contain no-repeat;content:'';filter:brightness(0) contrast(1.35);opacity:0;transform:translateX(42%) skewX(-5deg);transform-origin:center bottom;animation:hero-shadow-sweep 1.35s cubic-bezier(.16,.88,.25,1) .12s both}.hero-portrait-stage:after{position:absolute;z-index:6;right:7%;bottom:5%;width:390px;height:390px;border-radius:50%;background:radial-gradient(circle,#fff 0 8%,rgba(191,255,232,.95) 18%,rgba(69,220,165,.45) 40%,transparent 70%);content:'';mix-blend-mode:screen;opacity:0;pointer-events:none;animation:hero-portrait-flash .62s ease-out 1.22s both}.hero-portrait-stage>img{opacity:0;animation:hero-portrait-reveal .72s cubic-bezier(.2,.8,.2,1) 1.34s both}.portrait-glow{opacity:0;animation:hero-glow-in .8s ease-out 1.32s both}.portrait-ring{opacity:0;animation:hero-ring-in .9s cubic-bezier(.2,.8,.2,1) 1.48s both}.ring-two{animation-delay:1.62s}.portrait-note{opacity:0;animation:hero-note-pop .55s cubic-bezier(.2,1.4,.35,1) both}.note-one{animation-delay:2.48s}.note-two{animation-delay:2.64s}.note-three{animation-delay:2.8s}.hero-overline,.hero-pro h1,.hero-intro,.hero-actions,.hero-proof{opacity:0}.hero-overline{animation:hero-copy-rise .55s ease-out 1.78s both}.hero-overline i{transform:scaleX(0);transform-origin:left;animation:hero-line-draw .55s ease-out 2.02s both}.hero-pro h1{clip-path:inset(0 100% 0 0);animation:hero-title-wipe .85s cubic-bezier(.22,.8,.2,1) 2.03s both}.hero-pro h1 em:after{transform:rotate(-1.5deg) scaleX(0);transform-origin:left;animation:hero-underline-draw .55s ease-out 2.7s forwards}.hero-intro{filter:blur(7px);animation:hero-copy-focus .7s ease-out 2.62s both}.hero-actions{animation:hero-copy-rise .6s ease-out 2.9s both}.hero-proof{animation:hero-copy-rise .6s ease-out 3.12s both}.hero-proof>div{opacity:0;animation:hero-stat-pop .45s cubic-bezier(.2,1.35,.3,1) both}.hero-proof>div:nth-child(1){animation-delay:3.2s}.hero-proof>div:nth-child(2){animation-delay:3.34s}.hero-proof>div:nth-child(3){animation-delay:3.48s}
@keyframes hero-shadow-sweep{0%{opacity:0;transform:translateX(55%) skewX(-8deg) scaleX(.88)}18%{opacity:.88}72%{opacity:.95;transform:translateX(-3%) skewX(2deg) scaleX(1.02)}88%{opacity:1;transform:translateX(0) skewX(0) scaleX(1)}100%{opacity:0;transform:translateX(0) scale(1.01)}}
@keyframes hero-portrait-flash{0%,100%{opacity:0;transform:scale(.62)}38%{opacity:1;transform:scale(1.12)}65%{opacity:.48;transform:scale(1.28)}}
@keyframes hero-portrait-reveal{0%{opacity:0;filter:brightness(2.4) blur(4px);transform:translateX(12px) scale(.985)}45%{opacity:1;filter:brightness(1.35) blur(0)}100%{opacity:1;filter:brightness(1) drop-shadow(0 22px 26px rgba(14,72,57,.16));transform:none}}
@keyframes hero-glow-in{from{opacity:0;transform:scale(.72)}to{opacity:1;transform:scale(1)}}
@keyframes hero-ring-in{from{opacity:0;transform:scale(.72) rotate(-12deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes hero-note-pop{from{opacity:0;transform:translateY(12px) scale(.82)}to{opacity:1}}
@keyframes hero-copy-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes hero-line-draw{to{transform:scaleX(1)}}
@keyframes hero-title-wipe{0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateX(-18px)}100%{opacity:1;clip-path:inset(0 -8% -14% 0);transform:none}}
@keyframes hero-underline-draw{to{transform:rotate(-1.5deg) scaleX(1)}}
@keyframes hero-copy-focus{from{opacity:0;filter:blur(7px);transform:translateY(10px)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes hero-stat-pop{from{opacity:0;transform:translateY(9px) scale(.9)}to{opacity:1;transform:none}}
@media(max-width:991px){.hero-portrait-stage:before{right:-18%;width:125%;height:94%}.hero-portrait-stage:after{right:-8%;width:330px;height:330px}}
@media(max-width:700px){.hero-portrait-stage:before{right:0;width:100%;height:100%}.hero-portrait-stage:after{right:0;bottom:-15%;width:280px;height:280px}.hero-pro h1{animation-delay:1.95s}.hero-intro{animation-delay:2.48s}.hero-actions{animation-delay:2.74s}}
@media(prefers-reduced-motion:reduce){.hero-portrait-stage:before,.hero-portrait-stage:after{display:none}.hero-portrait-stage>img,.portrait-glow,.portrait-ring,.portrait-note,.hero-overline,.hero-pro h1,.hero-intro,.hero-actions,.hero-proof,.hero-proof>div{opacity:1;clip-path:none;filter:none;transform:none;animation:none}.hero-overline i,.hero-pro h1 em:after{transform:none;animation:none}}

/* Journey */
.journey-hero { background:radial-gradient(circle at 12% 15%,rgba(255,255,255,.65) 0 5%,transparent 5.2%),linear-gradient(140deg,#dff6ed,#9ce0c7 58%,#70c9aa) !important; }
.hero-copy h1 { color:#094c3c !important; }.hero-copy p{color:#286c59 !important}.tiny-label{color:#08745c !important}
.hero-copy button,.share-button { background:linear-gradient(135deg,#12a981,#08745c) !important; box-shadow:0 12px 24px rgba(8,116,92,.22) !important; }
.post-tags span,.load-wrap span { background:#e5f6ef !important; color:#08745c !important; }
.post-top time { color:#0b8064 !important; }
.modal-header { background:linear-gradient(135deg,#e4f7ef,#f8f0d4) !important; }

/* Goals */
.goals-hero { background:linear-gradient(140deg,#daf5ea,#8ddabd) !important; }
.goals-hero h1 { color:#083f32 !important; }.goals-hero p{color:#286755 !important}.goals-hero>div>span{color:#08745c !important}
.progress i { background:linear-gradient(90deg,#08745c,#48c99d) !important; }
.progress-copy b,.article-list time { color:#08745c !important; }
.create-milestone,.topic-composer { border-color:#cce8dd !important; background:#effaf6 !important; }
.create-milestone summary,.topic-composer summary { color:#08745c !important; }
.step-number { background:#e3f5ee !important; color:#08745c !important; }

/* Clubs */
.clubs-hero { background:linear-gradient(135deg,#e5f5ee,#c9ebdf,#eff8f4) !important; }
.clubs-hero span,.clubs-hero em { color:#08745c !important; }
.clubs-hero a,.login-discuss,.discuss-submit { background:#0f9272 !important; }
.club-detail-head { background:linear-gradient(135deg,#dff4ec,#eef9f5) !important; }
.club-logo,.author-avatar { background:#e1f5ed !important; }
.member-pill { background:#e4f5ee !important; color:#28715c !important; }
.club-join-form{display:inline-block;margin:14px 8px 0 0}.club-join-form button,.club-join-link{display:inline-block;padding:11px 16px;border:0;border-radius:12px;background:linear-gradient(135deg,#10a37f,#08745c);box-shadow:0 8px 18px rgba(8,116,92,.2);color:#fff!important;cursor:pointer;font:700 .68rem 'Be Vietnam Pro',sans-serif;text-decoration:none}.official-member-status{display:inline-block!important;margin-top:14px;padding:9px 13px;border-radius:99px;background:rgba(255,255,255,.72);color:#08745c!important;font-weight:700}.club-membership-notice{margin-bottom:22px;padding:13px 16px;border:1px solid #bde4d5;border-radius:13px;background:#eaf8f2;color:#17634f;font-size:.72rem;font-weight:600}
.quick-reply { background:#eef9f5 !important; }
.topic-tags span,.discussion-shell>a,.discussion-time,time { color:#237b62; }

/* Profile and authentication */
.profile-hero { background:linear-gradient(155deg,#c4eddf,#7fd1b3 57%,#58bd99) !important; }
.profile-hero h1 { color:#083f32 !important; }.nickname,.profile-pill,.quick-stats span{color:#17634f !important}
.avatar-frame { color:#08745c !important; box-shadow:0 22px 35px rgba(8,92,70,.2) !important; }
.profile-content { background:#fbfefa !important; }
.profile-themes{margin-top:22px;padding:24px;border-radius:20px;background:#eff8f4}.profile-themes h3{margin:0 0 6px}.profile-themes>div>p:not(.section-kicker){color:#687a73;font-size:.68rem}.theme-options{display:grid;margin-top:18px;grid-template-columns:repeat(5,1fr);gap:9px}.theme-choice input{position:absolute;opacity:0}.theme-choice>span{display:grid;padding:9px;border:2px solid transparent;border-radius:13px;background:#fff;cursor:pointer}.theme-choice i{display:block;height:42px;margin-bottom:8px;border-radius:8px}.theme-preview-emerald i{background:linear-gradient(135deg,#10a37f,#075c49)}.theme-preview-ocean i{background:linear-gradient(135deg,#3188b8,#164e73)}.theme-preview-sunset i{background:linear-gradient(135deg,#f28b57,#b74d55)}.theme-preview-lavender i{background:linear-gradient(135deg,#9374c8,#57417d)}.theme-preview-midnight i{background:linear-gradient(135deg,#233a56,#0b111b)}.theme-choice b{font-size:.62rem}.theme-choice small{margin-top:2px;color:#7a8983;font-size:.52rem}.theme-choice input:checked+span{border-color:#10a37f;box-shadow:0 5px 15px rgba(8,116,92,.12)}@media(max-width:700px){.theme-options{grid-template-columns:repeat(2,1fr)}}
.avatar-editor { background:linear-gradient(135deg,#e8f7f1,#fbf3d9) !important; }
.upload-button { border-color:#65b99c !important; color:#08745c !important; }
.actions button { background:linear-gradient(135deg,#10a37f,#08745c) !important; box-shadow:0 10px 20px rgba(8,116,92,.22) !important; }
.story-panel { background:linear-gradient(155deg,#d8f3e9,#8bd6ba) !important; }
.story-label { color:#08745c !important; }
.returning-welcome { background:linear-gradient(135deg,#e8f7f1,#f0f8e9) !important; border-color:#bfe4d5 !important; }

input:focus,select:focus,textarea:focus,.editor:focus,.club-editor:focus,.goal-editor:focus { border-color:#10a37f !important; box-shadow:0 0 0 4px rgba(16,163,127,.11) !important; }
.mention-hint{display:inline-flex;align-items:center;padding:6px 9px;color:#08745c;font-size:.62rem;font-weight:700}.editor-mention-wrap{position:relative}.mention-menu{position:absolute;left:12px;top:calc(100% + 7px);z-index:30;width:min(330px,calc(100% - 24px));max-height:260px;padding:7px;overflow:auto;border:1px solid #cfe4dc;border-radius:14px;background:#fff;box-shadow:0 16px 38px rgba(8,73,58,.17)}.mention-menu[hidden]{display:none}.mention-option{display:grid;width:100%;padding:9px;border:0;border-radius:10px;background:transparent;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:10px;color:#173d33;cursor:pointer;text-align:left}.mention-option>span{display:grid;grid-row:1/3;width:34px;height:34px;place-items:center;border-radius:10px;background:#dff5ed;color:#08745c;font-weight:800}.mention-option b{font-size:.7rem}.mention-option small{margin-top:2px;color:#71837c;font-size:.58rem}.mention-option:hover,.mention-option.active{background:#eaf8f3}.mention-option.active{box-shadow:inset 0 0 0 1px #bce3d4}

/* Dark mode keeps the emerald identity. */
.dark { --ink:#eaf8f3;--muted:#b8d0c7;--cream:#071f19;--blue:#3ed3a6;--deep:#75e0bd; }
.dark body { background:#071f19; }.dark .navbar{background:rgba(7,31,25,.92)}
.dark .hero{background:radial-gradient(circle at 80% 20%,#164f40 0 13%,transparent 13.2%),linear-gradient(135deg,#071f19,#0b382c) !important}
.dark .journey,.dark .journey-card,.dark .soft-card,.dark .friend{background:#0c3429}.dark .goals{background:#0a2c23 !important}.dark .together{background:linear-gradient(135deg,#123a30,#3b3523) !important}