@font-face { font-family: "Garet Book"; src: url("/fonts/Garet-Book.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Matcha Mint"; src: url("/fonts/Matcha%20Mint.ttf") format("truetype"); font-display: swap; }
:root { --bg:#07110c; --surface:#0d1a13; --text:#f4f0e6; --muted:#a9b4aa; --gold:#d6b85b; --gold-bright:#f0d989; --green:#1c543d; --line:rgba(244,240,230,.13); }
[data-theme="light"] { --bg:#f7f4eb; --surface:#fffdf7; --text:#10241a; --muted:#68736d; --line:rgba(21,62,45,.16); }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--bg); color:var(--text); font-family:"Garet Book",sans-serif; }
button,input,textarea,select { font:inherit; }
[hidden] { display:none!important; }
:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
.profile-topbar { position:sticky; top:0; z-index:20; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1rem; height:70px; padding:0 1.25rem; border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--surface) 90%,transparent); backdrop-filter:blur(20px); }
.profile-brand img { width:170px; }
.back-link,.theme-control { color:var(--muted); text-decoration:none; }
.theme-control { padding:.55rem .75rem; border:1px solid var(--line); border-radius:6px; background:transparent; cursor:pointer; }
.profile-shell { display:grid; grid-template-columns:230px minmax(0,1fr); min-height:calc(100vh - 70px); }
.profile-nav { display:flex; flex-direction:column; gap:.25rem; padding:1.4rem .8rem; border-right:1px solid var(--line); }
.profile-nav button,.profile-nav a { padding:.8rem; border:0; border-radius:5px; background:transparent; color:var(--muted); text-align:left; text-decoration:none; cursor:pointer; }
.profile-nav .active,.profile-nav button:hover,.profile-nav a:hover { background:color-mix(in srgb,var(--green) 15%,transparent); color:var(--text); }
.profile-main { min-width:0; padding:clamp(1.2rem,3vw,3rem); }
.profile-status { position:fixed; top:82px; right:20px; z-index:30; max-width:360px; padding:.7rem 1rem; border-radius:6px; background:var(--surface); box-shadow:0 12px 40px rgba(0,0,0,.18); }
.profile-status:empty { display:none; }
.profile-status[data-tone="success"] { color:#72b986; }
.profile-status[data-tone="error"] { color:#dc7569; }
.page-heading { display:flex; justify-content:space-between; align-items:end; gap:1rem; padding-bottom:1.2rem; border-bottom:1px solid var(--line); }
.page-heading p { margin:0 0 .2rem; color:var(--gold); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; }
.page-heading h1 { margin:0; font:400 clamp(2.4rem,4vw,4.4rem)/1 "Matcha Mint",serif; }
.page-heading > span { color:var(--muted); font-size:.78rem; }
.form-section { padding:1.5rem 0; border-bottom:1px solid var(--line); }
.identity-section { display:grid; grid-template-columns:150px minmax(0,1fr); gap:1.5rem; }
.avatar-editor { display:flex; flex-direction:column; align-items:center; gap:.55rem; }
.profile-avatar { display:grid; place-items:center; width:112px; height:112px; border-radius:50%; background:var(--green) center/cover; color:white; font:400 2.5rem "Matcha Mint",serif; }
.profile-avatar.has-image { color:transparent; }
.image-action,.avatar-editor button { border:0; background:none; color:var(--gold); font-size:.74rem; cursor:pointer; }
.field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.9rem 1rem; }
label { display:grid; gap:.35rem; color:var(--muted); font-size:.72rem; }
label span { color:var(--gold); }
input,textarea,select { width:100%; padding:.68rem .72rem; border:1px solid var(--line); border-radius:4px; background:transparent; color:var(--text); }
textarea { resize:vertical; line-height:1.55; }
.narrative-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.narrative-grid label:last-child { grid-column:1/-1; }
.security-section { display:grid; grid-template-columns:minmax(260px,1fr) minmax(200px,.65fr) minmax(200px,.65fr); align-items:end; gap:1rem; }
.security-section p { margin:0;color:var(--gold);font-size:.68rem;text-transform:uppercase;letter-spacing:.18em; }
.security-section h2 { margin:.2rem 0;font:400 1.7rem "Matcha Mint",serif; }
.security-section div span { color:var(--muted);font-size:.74rem; }
.form-actions { display:flex; justify-content:flex-end; padding:1.2rem 0; }
.form-actions button { padding:.72rem 1.1rem; border:1px solid #e0c56e; border-radius:5px; background:linear-gradient(135deg,#f2dda3,var(--gold)); color:#153e2d; font-weight:700; box-shadow:0 10px 24px rgba(150,111,16,.14); cursor:pointer; }
.activity-list { margin-top:1rem; }
.activity-row { display:grid; grid-template-columns:110px minmax(0,1fr) 110px; gap:1rem; padding:1rem .5rem; border-bottom:1px solid var(--line); color:var(--text); text-decoration:none; }
.activity-row span,.activity-row small { color:var(--muted); text-transform:capitalize; }
.question-history { padding:1.2rem .5rem; border-bottom:1px solid var(--line); }
.question-history header { display:flex; justify-content:space-between; color:var(--gold); }
.question-history h2 { font:400 1.45rem "Matcha Mint",serif; }
.question-history .answer { padding:1rem; border-left:2px solid var(--green); color:var(--muted); line-height:1.65; }
.question-history footer { margin-top:.7rem; color:var(--muted); font-size:.7rem; }
.empty-activity { padding:3rem; color:var(--muted); text-align:center; }
.communications-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-top:1.25rem; }
.communications-card { padding:1.2rem; border:1px solid var(--line); border-radius:7px; background:color-mix(in srgb,var(--surface) 86%,transparent); }
.communications-card h2 { margin:.25rem 0 .7rem; font:400 1.55rem "Matcha Mint",serif; }
.communications-card p { color:var(--muted); line-height:1.55; }
.communications-kicker { margin:0; color:var(--gold)!important; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; }
.communications-card button { padding:.7rem .85rem; border:1px solid var(--gold); border-radius:5px; background:transparent; color:var(--gold-bright); cursor:pointer; }
.communications-card button.danger { border-color:#b65b52; color:#dc7569; }
.communications-wide { grid-column:1/-1; }
.communications-preferences { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.communications-preferences fieldset { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; margin:0; padding:.7rem; border:1px solid var(--line); }
.communications-preferences legend { color:var(--muted); font-size:.72rem; }
.communications-preferences .communications-check { display:flex; grid-column:1/-1; align-items:center; gap:.5rem; }
.communications-preferences .communications-check input { width:auto; }
.communications-preferences button { justify-self:start; }
.communications-list { display:grid; gap:.55rem; color:var(--muted); }
.communications-list-row { display:flex; justify-content:space-between; gap:1rem; padding:.65rem 0; border-bottom:1px solid var(--line); }
.communications-list-row strong { color:var(--text); text-transform:capitalize; }
.communications-actions { display:flex; flex-wrap:wrap; gap:.6rem; }
.profile-mailing-preferences { display:grid; gap:1rem; }
.profile-mailing-preferences-head { display:flex; align-items:end; justify-content:space-between; gap:1rem; }
.profile-mailing-preferences-head h3 { margin:.25rem 0 .45rem; font:400 1.75rem "Matcha Mint",serif; }
.profile-mailing-preferences-head p:not(.communications-kicker) { max-width:68ch; margin:0; }
.profile-mailing-preferences-head > small { max-width:34ch; color:var(--muted); font-size:.7rem; overflow-wrap:anywhere; text-align:right; }
.profile-mailing-preferences form { display:grid; gap:1rem; }
.profile-mailing-preference-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; }
.profile-mailing-preference-grid label { grid-template-columns:auto minmax(0,1fr); align-items:start; gap:.75rem; min-height:92px; padding:.9rem; border:1px solid var(--line); border-radius:12px; background:color-mix(in srgb,var(--surface) 74%,transparent); cursor:pointer; }
.profile-mailing-preference-grid input { width:18px; height:18px; margin:.1rem 0 0; accent-color:var(--green); }
.profile-mailing-preference-grid span { display:grid; gap:.3rem; color:inherit; }
.profile-mailing-preference-grid strong { color:var(--text); font-size:.82rem; }
.profile-mailing-preference-grid small { color:var(--muted); font-size:.7rem; line-height:1.45; }
.profile-mailing-preference-actions { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.profile-mailing-preference-actions p { min-height:1.4em; margin:0; color:var(--muted); font-size:.72rem; }
.profile-mailing-preference-actions p[data-tone="error"] { color:#dc7569; }
.profile-mailing-preference-actions button { min-width:160px; }
.profile-mailing-empty,.profile-mailing-loading { grid-column:1/-1; margin:0; padding:1rem; color:var(--muted); text-align:center; }
#communications-link-output { display:none; margin-top:.8rem; padding:.75rem; border:1px dashed var(--gold); color:var(--gold-bright); font-size:1.5rem; letter-spacing:.22em; text-align:center; }
#communications-link-output[data-visible="true"] { display:block; }
@media(max-width:850px){.profile-shell{grid-template-columns:1fr}.profile-nav{position:sticky;top:70px;z-index:10;flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);background:var(--bg)}.identity-section,.security-section{grid-template-columns:1fr}.field-grid,.narrative-grid{grid-template-columns:1fr}.narrative-grid label:last-child{grid-column:auto}.profile-topbar{grid-template-columns:1fr auto}.back-link{display:none}}
@media(max-width:850px){.communications-grid,.communications-preferences,.profile-mailing-preference-grid{grid-template-columns:1fr}.communications-wide{grid-column:auto}.profile-mailing-preferences-head{align-items:start;flex-direction:column}.profile-mailing-preferences-head>small{text-align:left}.profile-mailing-preference-actions{align-items:stretch;flex-direction:column}.profile-mailing-preference-actions button{width:100%}}
@media(max-width:560px){.profile-brand img{width:120px}.profile-main{padding:1rem}.page-heading{align-items:start;flex-direction:column}.activity-row{grid-template-columns:1fr}.avatar-editor{align-items:start}.profile-nav a{display:none}}