/* UnspokenGrief — front end. Everything is scoped under .ug-wrap so it cannot leak into the theme. */
.ug-wrap{
	--ug-ink:#241f33; --ug-soft:#5d566e; --ug-faint:#8f889f; --ug-wash:#f4f3f8; --ug-panel:#fff;
	--ug-line:#dedbe8; --ug-accent:#46386f; --ug-slate:#4f7a7d; --ug-candle:#c9902a; --ug-danger:#9b2c3a;
	--ug-serif:Georgia,"Iowan Old Style","Palatino Linotype",serif;
	box-sizing:border-box; max-width:760px; margin:2rem auto; padding:0 1rem;
	color:var(--ug-ink); font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
.ug-wrap *,.ug-wrap *::before,.ug-wrap *::after{box-sizing:border-box}
.ug-wrap [hidden]{display:none!important}

/* Hero: the visible half is solid, the unspoken half is deliberately faint */
.ug-hero{padding:1.5rem 0 1.25rem; border-bottom:1px solid var(--ug-line); margin-bottom:1.5rem}
.ug-hero__line{margin:0; font:400 clamp(1.7rem,5.2vw,2.6rem)/1.15 var(--ug-serif); letter-spacing:-.01em; color:var(--ug-ink)}
.ug-visible{display:block; color:var(--ug-ink)}
.ug-silent{display:block; color:var(--ug-faint); font-style:italic; opacity:.8}
.ug-hero__name{margin:1rem 0 .25rem; font:600 1.05rem var(--ug-serif); color:var(--ug-accent); letter-spacing:.02em}
.ug-hero__lede{margin:0; max-width:56ch; color:var(--ug-soft); font-family:var(--ug-serif); font-size:1.05rem; line-height:1.7}
.ug-hero--compact{padding:.5rem 0 1rem}
.ug-hero--compact .ug-hero__line{font-size:clamp(1.25rem,3.6vw,1.6rem)}
.ug-hero--compact .ug-hero__lede{display:none}

/* Type + common */
.ug-h3{margin:0 0 .5rem; font:600 1.25rem/1.3 var(--ug-serif); color:var(--ug-ink)}
.ug-muted{color:var(--ug-soft); margin:.25rem 0 1rem}
.ug-hint{color:var(--ug-faint); font-size:.875rem; margin:.25rem 0 1rem}
.ug-done{margin:.5rem 0; padding:.75rem 1rem; border-left:3px solid var(--ug-slate); background:var(--ug-wash); color:var(--ug-ink)}
.ug-link{background:none; border:0; padding:.25rem 0; color:var(--ug-accent); text-decoration:underline; text-underline-offset:3px; cursor:pointer; font:inherit}
.ug-link:hover{color:var(--ug-ink)}

/* Buttons */
.ug-btn{display:inline-block; padding:.7rem 1.4rem; border:1px solid var(--ug-accent); border-radius:4px; background:var(--ug-accent); color:#fff; font:600 1rem system-ui,sans-serif; cursor:pointer; transition:background .15s}
.ug-btn:hover{background:#352a57}
.ug-btn:disabled{opacity:.6; cursor:progress}
.ug-btn--quiet{background:transparent; color:var(--ug-accent)}
.ug-btn--quiet:hover{background:var(--ug-wash)}
.ug-btn--danger{background:var(--ug-danger); border-color:var(--ug-danger)}
.ug-btn--danger:hover{background:#7d2230}
.ug-wrap :focus-visible{outline:3px solid var(--ug-candle); outline-offset:2px}

/* Forms */
.ug-form{margin:0}
.ug-field{margin:0 0 1rem}
.ug-field label,.ug-moodset legend{display:block; margin-bottom:.3rem; font-weight:600; font-size:.95rem}
.ug-field input,.ug-field textarea{width:100%; padding:.65rem .75rem; border:1px solid var(--ug-line); border-radius:4px; background:#fff; color:var(--ug-ink); font:inherit}
.ug-field textarea{font-family:var(--ug-serif); font-size:1.05rem; line-height:1.7; resize:vertical; min-height:10rem}
.ug-field input:focus,.ug-field textarea:focus{border-color:var(--ug-accent); outline:2px solid rgba(70,56,111,.25)}
.ug-check{display:flex; gap:.6rem; align-items:flex-start; margin:0 0 1rem; color:var(--ug-soft); font-size:.95rem}
.ug-check input{margin-top:.35rem}
.ug-hp{position:absolute!important; left:-9999px!important; height:0; overflow:hidden}
.ug-msg{margin:.75rem 0 0; min-height:1.4em; font-size:.95rem; color:var(--ug-soft)}
.ug-msg.is-ok{color:var(--ug-slate)}
.ug-msg.is-err{color:var(--ug-danger)}

/* Tabs */
.ug-tabs{display:flex; gap:.25rem; margin:0 0 1.25rem; border-bottom:1px solid var(--ug-line); overflow-x:auto}
.ug-tabs button{flex:0 0 auto; padding:.7rem 1rem; border:0; border-bottom:3px solid transparent; background:none; color:var(--ug-soft); font:600 .95rem system-ui,sans-serif; cursor:pointer}
.ug-tabs button.is-active{color:var(--ug-accent); border-bottom-color:var(--ug-accent)}
.ug-auth{max-width:480px}

/* Panels */
.ug-card{margin:0 0 1.25rem; padding:1.25rem 1.25rem 1rem; border:1px solid var(--ug-line); border-radius:6px; background:var(--ug-panel)}
.ug-danger{border-color:#e0bcc2}

/* Dashboard header */
.ug-me{display:flex; align-items:center; gap:.9rem; margin:0 0 1rem}
.ug-me__name{margin:0; font:600 1.15rem var(--ug-serif)}
.ug-stats{display:flex; gap:0; margin:0 0 1.25rem; padding:0; list-style:none; border:1px solid var(--ug-line); border-radius:6px; background:var(--ug-panel)}
.ug-stats li{flex:1; padding:.8rem 1rem; text-align:center}
.ug-stats li+li{border-left:1px solid var(--ug-line)}
.ug-stats strong{display:block; font:600 1.6rem/1.1 var(--ug-serif); color:var(--ug-accent)}
.ug-stats span{font-size:.85rem; color:var(--ug-soft)}

/* Check-in moods */
.ug-moods{display:grid; grid-template-columns:repeat(5,1fr); gap:.5rem; margin:.5rem 0}
.ug-mood{display:flex; flex-direction:column; align-items:center; gap:.2rem; padding:.8rem .25rem; border:1px solid var(--ug-line); border-radius:6px; background:var(--ug-wash); color:var(--ug-ink); font:500 .85rem system-ui,sans-serif; cursor:pointer; transition:border-color .15s,transform .15s}
.ug-mood span{font-size:1.6rem; line-height:1}
.ug-mood:hover{border-color:var(--ug-accent); transform:translateY(-2px)}
.ug-mood:disabled{opacity:.6; cursor:default; transform:none}
@media (max-width:520px){.ug-moods{grid-template-columns:repeat(3,1fr)}}

/* Journal */
.ug-prompt{display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:baseline; margin:0 0 1rem; padding:.75rem 1rem; background:var(--ug-wash); border-radius:4px}
.ug-prompt p{margin:0; flex:1 1 16rem; font-family:var(--ug-serif); font-style:italic; color:var(--ug-soft)}
.ug-moodset{border:0; margin:0 0 1rem; padding:0}
.ug-pill{display:inline-block; margin:0 .35rem .35rem 0}
.ug-pill input{position:absolute; opacity:0}
.ug-pill span{display:inline-block; padding:.35rem .8rem; border:1px solid var(--ug-line); border-radius:999px; font-size:.9rem; cursor:pointer}
.ug-pill input:checked+span{background:var(--ug-accent); border-color:var(--ug-accent); color:#fff}
.ug-pill input:focus-visible+span{outline:3px solid var(--ug-candle); outline-offset:2px}
.ug-entries{margin:1.5rem 0 1rem}
.ug-entry{padding:1rem 0; border-top:1px solid var(--ug-line)}
.ug-entry__meta{display:flex; flex-wrap:wrap; gap:.25rem .75rem; font-size:.85rem; color:var(--ug-faint)}
.ug-entry__title{margin:.2rem 0; font:600 1.1rem var(--ug-serif)}
.ug-entry__body{margin:.4rem 0 .5rem; font-family:var(--ug-serif); white-space:pre-wrap; overflow-wrap:anywhere}
.ug-entry__actions button{margin-right:1rem; font-size:.9rem}

/* Leaderboard */
.ug-board{margin:0 0 1.5rem}
.ug-board__list{margin:0; padding:0; list-style:none; border-top:1px solid var(--ug-line)}
.ug-board__row{display:flex; align-items:center; gap:.9rem; padding:.7rem .25rem; border-bottom:1px solid var(--ug-line)}
.ug-board__rank{flex:0 0 2rem; font:600 1.2rem var(--ug-serif); color:var(--ug-faint); text-align:center}
.ug-rank-1 .ug-board__rank{color:var(--ug-candle); font-size:1.5rem}
.ug-rank-2 .ug-board__rank,.ug-rank-3 .ug-board__rank{color:var(--ug-slate)}
.ug-board__name{flex:1; font-weight:600; overflow-wrap:anywhere}
.ug-board__pts{font:600 1.15rem var(--ug-serif); color:var(--ug-accent)}
.ug-board__pts small{font:400 .8rem system-ui,sans-serif; color:var(--ug-soft)}
.ug-rank-1{background:linear-gradient(90deg,rgba(201,144,42,.10),transparent 70%)}

/* Avatars */
.ug-avatar{display:inline-block; flex:0 0 auto; border-radius:50%; object-fit:cover; vertical-align:middle}
.ug-avatar--ph{display:inline-flex; align-items:center; justify-content:center; color:#fff; font-family:var(--ug-serif); font-weight:600}
.ug-profile-pic{display:flex; gap:1.25rem; align-items:center; flex-wrap:wrap}

/* Support note */
.ug-crisis{margin:2rem 0 0; padding:1rem 1.25rem; border-left:3px solid var(--ug-faint); color:var(--ug-soft); font-size:.9rem}
.ug-crisis p{margin:0}

@media (prefers-reduced-motion:reduce){.ug-wrap *{transition:none!important}}

/* Weekly winner */
.ug-winner{margin:0 0 1.75rem; padding:1.1rem 1.25rem; border:1px solid var(--ug-line); border-left:4px solid var(--ug-candle); border-radius:6px; background:linear-gradient(90deg,rgba(201,144,42,.09),transparent 65%),var(--ug-panel)}
.ug-winner__label{margin:0 0 .6rem; font:italic 1rem var(--ug-serif); color:var(--ug-soft)}
.ug-winner__who{display:flex; align-items:center; gap:1rem}
.ug-winner__name{display:block; font:600 1.5rem/1.2 var(--ug-serif); color:var(--ug-ink); overflow-wrap:anywhere}
.ug-winner__pts{color:var(--ug-accent); font-weight:600}
.ug-winner__past{margin:1rem 0 0; padding:.75rem 0 0; list-style:none; border-top:1px solid var(--ug-line); display:grid; gap:.4rem}
.ug-winner__past li{display:flex; align-items:center; gap:.6rem; font-size:.92rem}
.ug-winner__past small{margin-left:auto; color:var(--ug-faint)}
