/* Library Lux: shared styles for the account pages */
:root{
  --ground:#E6E9E3;--surface:#F7F8F4;--ink:#1D282C;--muted:#5C6966;--line:#C9D0C7;
  --accent:#1F5E73;--accent-ink:#F7F8F4;--flash:#E2A42B;--wood:#9A7752;--danger:#9B2F2F;--ok:#2F7A4A;
  --spine-ink:#F3F0E6;--bar:#1D282C;--bar-ink:#EEF1EA;--bar-muted:#A9B5B1;
  color-scheme:light;box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#141A1C;--surface:#1D2528;--ink:#E4E8E2;--muted:#97A39F;--line:#313C3F;
    --accent:#7DB8CC;--accent-ink:#11191B;--flash:#EFBA4A;--wood:#5E4733;--danger:#E07A6E;--ok:#6BC28A;
    --bar:#0E1314;--bar-ink:#EEF1EA;--bar-muted:#93A09C;color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --ground:#141A1C;--surface:#1D2528;--ink:#E4E8E2;--muted:#97A39F;--line:#313C3F;
  --accent:#7DB8CC;--accent-ink:#11191B;--flash:#EFBA4A;--wood:#5E4733;--danger:#E07A6E;--ok:#6BC28A;
  --bar:#0E1314;--bar-ink:#EEF1EA;--bar-muted:#93A09C;color-scheme:dark;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--ground);color:var(--ink);font-family:"Bricolage Grotesque",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.5}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
[hidden]{display:none!important}

.luxbar{background:var(--bar);color:var(--bar-ink)}
.luxbar .in{max-width:1120px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap}
.luxbar .brand{font-family:Spectral,Georgia,serif;font-weight:600;font-size:20px;color:var(--bar-ink);text-decoration:none;margin-right:auto}
.luxbar a.nav{color:var(--bar-muted);text-decoration:none;font-size:15px}
.luxbar a.nav:hover,.luxbar a.nav[aria-current="page"]{color:var(--bar-ink);text-decoration:underline;text-underline-offset:4px}

.page{max-width:760px;margin:0 auto;padding:36px 20px 70px}
.page.narrow{max-width:460px}
h1.title{font-family:Spectral,Georgia,serif;font-weight:600;font-size:clamp(30px,5vw,42px);line-height:1.08;margin:0 0 8px}
.lede{color:var(--muted);margin:0 0 26px;font-size:17px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px;margin-bottom:20px}
.card h2{font-family:Spectral,Georgia,serif;font-size:23px;margin:0 0 6px;font-weight:600}
.card p.sub{color:var(--muted);margin:0 0 16px}
.field{display:flex;flex-direction:column;gap:5px;font-size:14px;color:var(--muted);margin-bottom:14px}
.field input,.field textarea,.field select{padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--ground);color:var(--ink);font-size:16px}
.field textarea{resize:vertical;min-height:76px}
.field small{font-size:13px}
.field small.good{color:var(--ok)}
.field small.bad{color:var(--danger)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:15px;margin:4px 0 14px}
.check input{margin-top:4px}
.btn{border:0;border-radius:10px;padding:11px 18px;background:var(--accent);color:var(--accent-ink);font-weight:500;cursor:pointer;font-size:16px}
.btn:disabled{opacity:.55;cursor:default}
.btn.quiet{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.danger{background:transparent;color:var(--danger);border:1px solid currentColor}
.btn.wide{width:100%}
.link{border:0;background:none;padding:0;color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:3px;font-size:15px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 0 20px}
.tab{border:0;background:none;padding:10px 12px;cursor:pointer;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent);font-weight:500}
.msg{padding:12px 14px;border-radius:10px;background:var(--ground);border-left:4px solid var(--muted);margin:0 0 16px;font-size:15px}
.msg.ok{border-left-color:var(--ok)}
.msg.bad{border-left-color:var(--danger)}
.msg.note{border-left-color:var(--flash)}
.stats{display:flex;flex-wrap:wrap;gap:14px 30px;margin:4px 0 16px}
.stats b{display:block;font-size:26px;line-height:1.1;font-variant-numeric:tabular-nums}
.stats span{font-size:13px;color:var(--muted)}
.progress{height:10px;border-radius:10px;background:var(--line);overflow:hidden;margin:12px 0 6px}
.progress i{display:block;height:100%;width:0;background:var(--flash);transition:width .2s}
.log{font-size:14px;color:var(--muted);margin:6px 0 0;max-height:180px;overflow:auto}
.avatar{width:64px;height:64px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:flex;align-items:center;justify-content:center;font-family:Spectral,Georgia,serif;font-size:28px;font-weight:600;flex:none}
.who{display:flex;gap:16px;align-items:center;margin-bottom:18px}
.who b{display:block;font-size:19px}
.who small{color:var(--muted)}
.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--ground);padding:10px 16px;border-radius:10px;font-size:15px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90vw;z-index:80}
.toast.show{opacity:1}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.page a:not([class]){color:var(--accent);text-underline-offset:3px}