/* Lumora — flat design system. One font, one accent, real spacing, no glass/blur/emoji. */
:root{
  --bg:#ffffff; --bg-2:#f4f5f7; --ink:#15161a; --dim:#6b6f7a; --line:#e6e7eb;
  --accent:#d61f69; --accent-ink:#ffffff;
  --radius:14px; --font:'Inter',system-ui,sans-serif;
}
html:not([data-theme]){color-scheme:light dark}
@media(prefers-color-scheme:dark){
  html:not([data-theme]){
    --bg:#121214; --bg-2:#1b1c1f; --ink:#f2f2f4; --dim:#a4a7b2; --line:#2a2b30;
  }
}
[data-theme=dark]{
  --bg:#121214; --bg-2:#1b1c1f; --ink:#f2f2f4; --dim:#a4a7b2; --line:#2a2b30;
}
[data-theme=light]{
  --bg:#ffffff; --bg-2:#f4f5f7; --ink:#15161a; --dim:#6b6f7a; --line:#e6e7eb;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--bg)}
body{background:var(--bg);color:var(--ink);font:500 15px/1.55 var(--font);margin:0;padding-bottom:88px}
h1,h2,h3{font-family:var(--font);font-weight:800;letter-spacing:-.02em;margin:0 0 6px}
a{color:var(--accent);text-decoration:none}
.sub,.count,label,.lab{color:var(--dim)}
.wrap{max-width:520px;margin:0 auto;padding:18px 20px 40px}

/* Surfaces: flat cards, one border, no blur/shadow stacking */
.glass,.card,.res,.svc,.seg,#anims,#ecs,.faq,.notif,.vcard,#olive-panel,.bottom-nav-inner,.stat,.item{
  background:var(--bg-2) !important;
  border:1px solid var(--line) !important;
  border-radius:var(--radius);
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.svc{border-radius:var(--radius)}

/* Inputs */
input:not([type=range]):not([type=checkbox]),textarea,select{
  background:var(--bg) !important;border:1px solid var(--line) !important;
  border-radius:10px;box-shadow:none !important;color:var(--ink) !important;
  padding:12px 14px;font:inherit;
}
input:focus,textarea:focus,select:focus{border-color:var(--accent) !important;outline:2px solid transparent}
select option{color:#15161a}

/* Buttons */
.btn,.chip,.bellbtn,.sw,#theme{
  background:var(--bg) !important;border:1px solid var(--line) !important;
  border-radius:10px;box-shadow:none !important;color:var(--ink);
  font-weight:700;padding:12px 18px;cursor:pointer;
}
.btn:active{transform:scale(.98)}
.btn.pri{background:var(--accent) !important;border:0 !important;color:var(--accent-ink) !important}
.seg button[aria-pressed=true],.seg button[aria-selected=true],
#anims button[aria-pressed=true],#ecs button[aria-pressed=true]{
  background:var(--accent) !important;color:#fff !important;
}
.sw[aria-pressed=true]{box-shadow:0 0 0 2px var(--accent) !important}
.txt{color:var(--accent)}

/* Bottom nav + app bar */
.appbar{display:flex;justify-content:space-between;align-items:center;max-width:960px;margin:0 auto;padding:20px 20px 8px}
.appbar .logo{font-family:var(--font);font-weight:800;font-size:1.25rem;color:var(--ink);letter-spacing:-.02em}
.appbar .logo span{color:var(--accent)}
.appbar .logo .by{font-size:.5rem;font-weight:800;letter-spacing:.16em;color:var(--dim);margin-left:5px;vertical-align:middle;text-transform:uppercase}
.appbar-r{display:flex;align-items:center;gap:10px}
.bellbtn{position:relative;width:40px;height:40px;display:grid;place-items:center;font-size:17px;border-radius:10px}
.bell-badge{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--accent);color:#fff;font-size:10px;font-weight:800;display:none;align-items:center;justify-content:center;line-height:1}
.bell-badge.on{display:flex}
.plan-pill{display:inline-block;margin-right:8px;padding:6px 12px;border-radius:8px;font-size:.72rem;font-weight:800;color:#fff;background:var(--accent)}
.plan-pill.free{background:var(--bg-2);color:var(--dim);border:1px solid var(--line)}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--bg);border-top:1px solid var(--line);padding:6px 14px calc(6px + env(safe-area-inset-bottom))}
.bottom-nav-inner{max-width:460px;margin:0 auto;display:flex;border:0 !important}
.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 2px;border-radius:10px;color:var(--dim);font-size:.66rem;font-weight:700}
.nav-item svg{width:20px;height:20px}
.nav-item.active{color:var(--accent);background:var(--bg-2)}

.wrap{max-width:520px;padding-top:14px}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms !important}}

.themebtn{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:var(--bg);border:1px solid var(--line);color:var(--ink);cursor:pointer;font-size:16px}
.themebtn svg{width:19px;height:19px}


/* Love-message photo art (restored: the flat redesign dropped these variables, leaving the preview blank) */
:root{
  --p-embrace:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 800'><defs><linearGradient id='g' x1='0' y1='0' x2='1' y2='1'><stop offset='0%' stop-color='%23ffb199'/><stop offset='45%' stop-color='%23ff6fa5'/><stop offset='100%' stop-color='%236a3fb5'/></linearGradient></defs><rect width='800' height='800' fill='url(%23g)'/><g fill='%23ffffff' opacity='.16'><path d='M330 560 C260 500 260 420 320 400 C350 390 380 405 400 430 C420 405 450 390 480 400 C540 420 540 500 470 560 L400 620 Z'/></g><g stroke='%23ffffff' stroke-width='3' opacity='.2' fill='none'><circle cx='400' cy='400' r='260'/><circle cx='400' cy='400' r='330'/></g></svg>");
  --p-beach:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 800'><defs><linearGradient id='g' x1='0' y1='0' x2='0' y2='1'><stop offset='0%' stop-color='%23ffe3b0'/><stop offset='45%' stop-color='%23ff9d7a'/><stop offset='100%' stop-color='%233a5aa8'/></linearGradient></defs><rect width='800' height='800' fill='url(%23g)'/><circle cx='400' cy='260' r='90' fill='%23fff6df' opacity='.85'/><path d='M0 520 Q200 470 400 520 T800 520 V800 H0 Z' fill='%23274b8e' opacity='.55'/><path d='M0 600 Q200 560 400 600 T800 600 V800 H0 Z' fill='%231c3a70' opacity='.65'/></svg>");
  --p-golden:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 800'><defs><radialGradient id='g' cx='70%' cy='25%' r='100%'><stop offset='0%' stop-color='%23fff1c2'/><stop offset='45%' stop-color='%23ff9d6a'/><stop offset='100%' stop-color='%23c8437a'/></radialGradient></defs><rect width='800' height='800' fill='url(%23g)'/><circle cx='560' cy='220' r='120' fill='%23fff8e3' opacity='.8'/><path d='M0 560 L800 560 L800 800 L0 800 Z' fill='%232a1230' opacity='.35'/></svg>");
  --g1:#d61f69; --g2:#ff7a59; --serif:var(--font);
}

/* Sign-in gate overlay: opaque scrim + blur so the page behind never shows through */
#gateScreen{background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
#gateScreen .card{box-shadow:0 20px 60px rgba(0,0,0,.25) !important}
/* App bar: never let the plan pill overlap the logo */
.appbar{gap:8px}
.appbar .logo{flex:none}
.appbar-r{min-width:0;gap:8px}
.plan-pill{margin-right:0;white-space:nowrap;padding:6px 10px}
.pl-short{display:none}
@media(max-width:430px){.pl-full{display:none}.pl-short{display:inline}}

/* Footer (legal links) */
.foot{max-width:960px;margin:0 auto;padding:10px 20px 28px;color:var(--dim);font-size:.82rem;display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center}
.foot a{color:var(--dim)}.foot a:hover{color:var(--accent)}

.pulse svg{display:block}
.opt span:first-child{color:var(--accent);display:grid;place-items:center}
#olive-btn{display:grid;place-items:center}