:root{
  --bg:#101010; --panel:#181818; --panel2:#222; --yellow:#f4c800; --ink:#0d0d0d;
  --text:#f4f1e8; --muted:#aaa69d; --line:#393939; --white:#fff; --radius:18px;
}
*{box-sizing:border-box} html{background:var(--bg)} body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(244,200,0,.04),transparent 22%,transparent 75%,rgba(244,200,0,.025));z-index:0}
.noise{position:fixed;inset:0;opacity:.035;pointer-events:none;z-index:1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}
button,input,textarea{font:inherit}.hidden{display:none!important}.app-shell{position:relative;z-index:2;max-width:780px;margin:auto;padding:env(safe-area-inset-top) 16px calc(92px + env(safe-area-inset-bottom))}
.topbar{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:18px 2px 20px}.brand{font-weight:950;letter-spacing:-.04em;font-size:1.2rem}.brand span{color:var(--yellow)}.date-line,.eyebrow{font-size:.7rem;letter-spacing:.13em;font-weight:800;color:var(--muted);text-transform:uppercase}.date-line{margin-top:4px}.status-pill{border:1px solid var(--line);background:#171717;color:var(--text);border-radius:999px;padding:9px 11px;font-size:.72rem;font-weight:800;white-space:nowrap}.status-pill span:first-child{color:#62d36b;margin-right:4px}
.view{display:none}.view.active{display:block}.hero-grid{display:grid;grid-template-columns:1.65fr .85fr;gap:12px}.hero-card{border-radius:var(--radius);padding:20px;min-height:220px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;position:relative}.hero-card:after{content:"";position:absolute;right:-35px;bottom:-55px;width:150px;height:150px;border:20px solid currentColor;opacity:.08;border-radius:50%}.hero-card.yellow{background:var(--yellow);color:var(--ink)}.hero-card.yellow .eyebrow{color:#4c4300}.hero-card h1{font-size:clamp(2.6rem,10vw,5.4rem);line-height:.82;letter-spacing:-.075em;margin:16px 0 10px;font-weight:950}.hero-card p{margin:0;font-weight:650;line-height:1.4}.hero-card.dark{background:var(--panel);border:1px solid var(--line)}.stat-card{justify-content:flex-start}.big-number{font-size:4.4rem;font-weight:950;letter-spacing:-.08em;color:var(--yellow);margin:18px 0 0}.stat-card>p{font-size:.73rem;letter-spacing:.12em}.mini-stats{margin-top:auto;border-top:1px solid var(--line);padding-top:12px;display:grid;gap:6px;color:var(--muted);font-size:.75rem}.mini-stats b{color:var(--text)}
.birthday-hero{background:var(--yellow);color:var(--ink);border-radius:var(--radius);padding:22px;margin-bottom:12px;position:relative;overflow:hidden}.birthday-hero:before{content:"07";position:absolute;right:-7px;bottom:-39px;font-size:12rem;font-weight:950;opacity:.12;letter-spacing:-.1em}.birthday-hero h1{font-size:clamp(3rem,15vw,7rem);line-height:.8;letter-spacing:-.08em;margin:10px 0}.birthday-kicker{font-size:.72rem;font-weight:900;letter-spacing:.15em}.birthday-hero p{font-weight:750;max-width:390px}
.section{margin-top:26px}.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin:0 2px 10px}.section-head.top{margin-top:18px}.section-head h1,.section-head h2{margin:0;font-weight:950;letter-spacing:-.045em}.section-head h1{font-size:2.3rem}.section-head h2{font-size:1.1rem}.section-head span{font-size:.72rem;color:var(--muted);text-align:right}.timeline{display:grid;gap:8px}.timeline-item{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:15px 16px;display:flex;gap:13px;align-items:center}.timeline-time{color:var(--yellow);font-size:.72rem;font-weight:900;letter-spacing:.08em;width:48px}.timeline-main b{display:block}.timeline-main small{color:var(--muted)}
.challenge-card{background:#e7e3d8;color:#141414;border-radius:var(--radius);padding:20px}.challenge-label{font-size:.67rem;font-weight:950;letter-spacing:.15em;color:#777367}.challenge-card p{font-size:1.45rem;line-height:1.15;font-weight:850;letter-spacing:-.035em;min-height:78px}.ghost{border:1px solid rgba(0,0,0,.25);background:transparent;padding:11px 13px;border-radius:10px;font-weight:900;font-size:.74rem;letter-spacing:.06em}.primary{border:0;background:var(--yellow);color:var(--ink);border-radius:12px;padding:14px 16px;font-weight:950;letter-spacing:.04em;cursor:pointer}.big-action{width:100%;font-size:1rem;margin:5px 0 18px;min-height:54px}.joker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.joker{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:14px;min-height:145px;color:var(--text);text-align:left}.joker.used{opacity:.42;text-decoration:line-through}.joker .icon{font-size:1.6rem}.joker b{display:block;margin:10px 0 5px}.joker small{color:var(--muted);line-height:1.35;display:block}
.feed,.quote-wall{display:grid;gap:11px}.moment-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}.moment-card img{width:100%;display:block;max-height:520px;object-fit:cover}.moment-body{padding:14px}.moment-body p{margin:0 0 10px;font-size:1.02rem;line-height:1.35}.meta{font-size:.7rem;color:var(--muted);display:flex;justify-content:space-between;gap:12px}.quote-card{background:#e7e3d8;color:#161616;border-radius:16px;padding:18px;position:relative}.quote-card:before{content:'“';position:absolute;right:12px;top:-12px;font-size:6rem;font-weight:950;color:rgba(0,0,0,.08)}.quote-card blockquote{margin:0 0 14px;font-size:1.35rem;font-weight:850;line-height:1.2;letter-spacing:-.03em}.quote-card footer{font-size:.75rem;font-weight:800;color:#5a574f}
.wrapped-hero{background:var(--yellow);color:var(--ink);border-radius:var(--radius);padding:22px;margin:18px 0}.wrapped-hero .eyebrow{color:#4c4300}.wrapped-hero h1{font-size:clamp(3rem,13vw,6.3rem);line-height:.82;letter-spacing:-.075em;margin:14px 0 0}.wrapped-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.wrapped-stat{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;min-height:130px}.wrapped-stat span{display:block;font-size:3.2rem;font-weight:950;letter-spacing:-.06em;color:var(--yellow)}.wrapped-stat small{color:var(--muted);font-weight:750}.locked{text-align:center;border:1px dashed #555;border-radius:16px;padding:28px 18px;background:var(--panel)}.lock-icon{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:var(--ink);font-weight:950;margin:0 auto 15px}.locked h2{margin:0}.locked p{color:var(--muted)}
.bottom-nav{position:fixed;z-index:10;bottom:0;left:50%;transform:translateX(-50%);width:min(780px,100%);padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:rgba(16,16,16,.94);backdrop-filter:blur(18px);border-top:1px solid #2d2d2d;display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.nav-btn{border:0;background:transparent;color:#7e7b75;border-radius:10px;padding:8px 4px;font-size:.67rem;font-weight:800}.nav-btn span{display:block;font-size:1.15rem;margin-bottom:1px}.nav-btn.active{background:#232323;color:var(--yellow)}
.setup{position:fixed;z-index:100;inset:0;background:var(--bg);display:grid;place-items:center;padding:20px}.setup-card{width:min(440px,100%);background:var(--yellow);color:var(--ink);border-radius:20px;padding:24px}.setup-card .brand span{color:#5b4c00}.setup-card .eyebrow,.setup-card .muted{color:#625800}.setup-card h1{font-size:3rem;letter-spacing:-.06em;margin:24px 0 5px}.setup-card input{width:100%;margin:18px 0 10px;background:#f7e76b;border:1px solid rgba(0,0,0,.2);border-radius:12px;padding:14px;color:#111}.setup-card .primary{background:#111;color:var(--yellow);width:100%}
.sheet{width:min(560px,calc(100% - 20px));border:1px solid var(--line);background:#151515;color:var(--text);border-radius:20px;padding:0;max-height:82vh}.sheet::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}.sheet form{padding:18px}.sheet-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.sheet-head h2{margin:0;letter-spacing:-.04em}.close{border:0;background:#262626;color:#eee;width:36px;height:36px;border-radius:50%;font-size:1.5rem}.sheet label{display:block;font-size:.76rem;color:var(--muted);font-weight:800;margin:12px 0}.sheet input,.sheet textarea{display:block;width:100%;margin-top:7px;background:#222;border:1px solid #444;color:#fff;border-radius:12px;padding:13px}.sheet textarea{min-height:110px;resize:vertical}.sheet .primary{width:100%;margin-top:10px}.muted{color:var(--muted)}.status-options{display:grid;gap:8px}.status-option{border:1px solid var(--line);background:#202020;color:var(--text);padding:13px;border-radius:12px;text-align:left;font-weight:800}.toast{position:fixed;z-index:200;left:50%;bottom:100px;transform:translateX(-50%);background:var(--yellow);color:#111;padding:11px 14px;border-radius:999px;font-weight:900;font-size:.75rem;box-shadow:0 10px 30px rgba(0,0,0,.35)}.empty{border:1px dashed #414141;border-radius:14px;padding:28px 18px;color:var(--muted);text-align:center}
@media(max-width:620px){.hero-grid{grid-template-columns:1fr}.hero-card{min-height:190px}.stat-card{min-height:150px}.big-number{font-size:3.3rem}.mini-stats{grid-template-columns:1fr 1fr}.joker-grid{grid-template-columns:1fr}.joker{min-height:0}.topbar{align-items:center}.status-pill{max-width:145px;overflow:hidden;text-overflow:ellipsis}.section-head span{max-width:45%}}