:root{--bg:#f7efe3;--paper:#fffaf2;--ink:#1f2320;--muted:#746b61;--brown:#8c6446;--brown-dark:#5c3b28;--gold:#c69249;--green:#173c34;--line:rgba(31,35,32,.12);--shadow:0 24px 80px rgba(92,59,40,.14);--radius:28px;--font-body:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif;--font-display:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:radial-gradient(circle at 20% 10%,rgba(198,146,73,.22),transparent 34%),radial-gradient(circle at 80% 0%,rgba(23,60,52,.16),transparent 30%),linear-gradient(180deg,#fbf3e7 0%,#f7efe3 44%,#efe3d0 100%);color:var(--ink);min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.26;background-image:linear-gradient(rgba(31,35,32,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(31,35,32,.035) 1px,transparent 1px);background-size:42px 42px;z-index:0}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.page{position:relative;z-index:1}.container{width:min(1180px,calc(100% - 40px));margin:0 auto}.nav{position:sticky;top:18px;z-index:10;margin-top:18px}.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 18px;border:1px solid rgba(92,59,40,.13);background:rgba(255,250,242,.72);backdrop-filter:blur(18px);border-radius:999px;box-shadow:0 18px 50px rgba(92,59,40,.08)}.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:-.04em;font-size:22px}.brand-mark{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fffaf2;background:radial-gradient(circle at 35% 25%,#d9a760,transparent 38%),linear-gradient(145deg,var(--green),#0d211d);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);font-size:14px}.nav-links{display:flex;align-items:center;gap:22px;color:var(--muted);font-size:14px;font-weight:650}.nav-links a:hover{color:var(--ink)}.nav-cta{padding:12px 18px;border-radius:999px;background:var(--ink);color:#fffaf2!important;font-weight:800;font-size:14px;box-shadow:0 12px 28px rgba(31,35,32,.18)}.flash{margin-top:24px;padding:15px 18px;border-radius:18px;background:rgba(23,60,52,.12);border:1px solid rgba(23,60,52,.16);font-weight:750;color:var(--green)}.flash.error{background:rgba(150,48,36,.1);border-color:rgba(150,48,36,.18);color:#7b271e}.hero{padding:92px 0 70px}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:54px}.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:9px 14px;border-radius:999px;border:1px solid rgba(140,100,70,.18);background:rgba(255,250,242,.62);color:var(--brown-dark);font-size:14px;font-weight:750;margin-bottom:22px}.eyebrow span{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 6px rgba(198,146,73,.18)}h1{font-family:var(--font-body);font-size:clamp(46px,7vw,88px);line-height:.94;letter-spacing:-.065em;color:var(--ink);margin-bottom:24px}h1 em{color:var(--brown);font-weight:500}.hero-desc{max-width:610px;color:var(--muted);font-size:19px;line-height:1.75;margin-bottom:34px}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-bottom:34px}.btn{border:0;cursor:pointer;border-radius:999px;padding:15px 22px;font-size:15px;font-weight:850;transition:.25s ease;display:inline-flex;align-items:center;justify-content:center;gap:10px}.btn-primary{background:var(--green);color:#fffaf2;box-shadow:0 18px 38px rgba(23,60,52,.22)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 24px 46px rgba(23,60,52,.28)}.btn-ghost{background:rgba(255,250,242,.66);color:var(--brown-dark);border:1px solid rgba(92,59,40,.12)}.hero-note{color:var(--muted);font-size:14px;font-weight:650}.memory-stage{position:relative;min-height:620px}.big-card{position:relative;border-radius:38px;padding:24px;background:rgba(255,250,242,.74);border:1px solid rgba(92,59,40,.12);box-shadow:var(--shadow);backdrop-filter:blur(20px);transform:rotate(1deg)}.photo-card{overflow:hidden;border-radius:28px;height:390px;background:linear-gradient(180deg,rgba(31,35,32,.02),rgba(31,35,32,.28)),url(default-cover.svg);background-size:cover;background-position:center;position:relative}.photo-card:after{content:"Mùa hè 2026";position:absolute;left:20px;bottom:20px;color:#fffaf2;font-family:var(--font-body);font-size:38px;letter-spacing:-.04em;text-shadow:0 8px 26px rgba(0,0,0,.28)}.memory-info{display:grid;grid-template-columns:1fr auto;gap:16px;padding-top:18px;align-items:end}.memory-info h3{font-family:var(--font-body);font-size:30px;letter-spacing:-.045em;margin-bottom:6px}.memory-info p{color:var(--muted);line-height:1.6;font-size:15px}.seal{width:74px;height:74px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#e3bd7a,transparent 38%),linear-gradient(145deg,#b17443,#6c3f2a);color:#fff6e8;display:grid;place-items:center;text-align:center;font-weight:900;font-size:13px;line-height:1.05;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),0 14px 26px rgba(92,59,40,.22)}.floating-card{position:absolute;border-radius:24px;background:rgba(255,250,242,.86);border:1px solid rgba(92,59,40,.12);box-shadow:0 18px 50px rgba(92,59,40,.13);backdrop-filter:blur(16px);padding:18px}.date-card{right:-18px;top:48px;width:205px;transform:rotate(-4deg)}.date-card .label,.letter-card .label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.14em;font-weight:850;margin-bottom:10px}.date-card strong{font-family:var(--font-body);font-size:34px;letter-spacing:-.05em;display:block;color:var(--green)}.date-card p{color:var(--muted);line-height:1.55;font-size:14px;margin-top:8px}.letter-card{left:-20px;bottom:58px;width:250px;transform:rotate(-3deg)}.letter-card p{color:var(--brown-dark);font-family:var(--font-body);font-size:20px;line-height:1.45}.mini-tape{position:absolute;width:72px;height:26px;background:rgba(198,146,73,.3);border:1px solid rgba(140,100,70,.12);transform:rotate(-12deg);top:-10px;left:42%;border-radius:4px}.section{padding:86px 0}.compact-section{padding:48px 0 0}.section-head{max-width:740px;margin-bottom:38px}.section-kicker{color:var(--brown);font-size:14px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;margin-bottom:14px}.section-title{font-family:var(--font-body);font-size:clamp(36px,4.4vw,62px);line-height:1;letter-spacing:-.055em;margin-bottom:18px}.section-desc{color:var(--muted);font-size:18px;line-height:1.75}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature,.empty-card{background:rgba(255,250,242,.66);border:1px solid rgba(92,59,40,.12);border-radius:var(--radius);padding:28px;box-shadow:0 16px 46px rgba(92,59,40,.08);position:relative;overflow:hidden}.feature-icon{width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:var(--green);color:#fffaf2;margin-bottom:22px;font-size:22px}.feature h3,.empty-card h2{font-family:var(--font-body);font-size:27px;letter-spacing:-.04em;margin-bottom:12px}.feature p,.empty-card p{color:var(--muted);line-height:1.7;font-size:15.5px}.create-box{display:grid;grid-template-columns:.9fr 1.1fr;gap:24px;align-items:stretch;background:radial-gradient(circle at 0% 0%,rgba(198,146,73,.18),transparent 28%),rgba(255,250,242,.66);border:1px solid rgba(92,59,40,.12);border-radius:38px;padding:22px;box-shadow:var(--shadow)}.create-preview{min-height:520px;border-radius:28px;background:linear-gradient(180deg,rgba(23,60,52,.06),rgba(23,60,52,.28)),url(default-cover.svg);background-size:cover;background-position:center;position:relative;overflow:hidden}.create-preview-content{position:absolute;left:24px;right:24px;bottom:24px;padding:22px;border-radius:24px;background:rgba(255,250,242,.83);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.32)}.create-preview-content span{color:var(--brown);font-size:13px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.create-preview-content h3{font-family:var(--font-body);font-size:34px;letter-spacing:-.05em;margin-top:8px;margin-bottom:8px}.create-preview-content p{color:var(--muted);line-height:1.6}.form-card{padding:20px;display:flex;flex-direction:column;justify-content:center}.form-card h2,.auth-card h1,.dash-head h1{font-family:var(--font-body);font-size:clamp(36px,4vw,56px);line-height:1;letter-spacing:-.055em;margin-bottom:14px}.form-card>p,.auth-card p,.dash-head p{color:var(--muted);line-height:1.7;font-size:17px;margin-bottom:24px}.memory-form{display:grid;gap:14px}.field,.auth-card label{display:grid;gap:8px;color:var(--brown-dark);font-size:13px;font-weight:850}.field input,.field textarea,.field select,.auth-card input{width:100%;border:1px solid rgba(92,59,40,.14);background:rgba(255,250,242,.74);border-radius:18px;padding:15px 16px;color:var(--ink);outline:none;font:inherit;resize:none}.field textarea{min-height:112px}.field input:focus,.field textarea:focus,.field select:focus,.auth-card input:focus{border-color:rgba(23,60,52,.44);box-shadow:0 0 0 4px rgba(23,60,52,.08)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.auth-wrap{min-height:64vh;display:grid;place-items:center;padding:70px 0}.auth-card{width:min(520px,100%);padding:34px;border-radius:34px;background:rgba(255,250,242,.76);border:1px solid rgba(92,59,40,.12);box-shadow:var(--shadow);display:grid;gap:16px}.auth-card .btn{width:100%;margin-top:8px}.small{font-size:14px!important;margin-bottom:0!important;text-align:center}.small a{font-weight:900;color:var(--green)}.dash-head{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:34px}.box-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.memory-card{border-radius:32px;overflow:hidden;background:rgba(255,250,242,.72);border:1px solid rgba(92,59,40,.12);box-shadow:0 18px 48px rgba(92,59,40,.1)}.memory-cover{display:block;height:230px;background-size:cover;background-position:center}.memory-body{padding:22px}.pill{display:inline-flex;margin-bottom:12px;padding:7px 11px;border-radius:999px;font-size:12px;font-weight:900}.pill.open{background:rgba(23,60,52,.12);color:var(--green)}.pill.locked{background:rgba(198,146,73,.18);color:var(--brown-dark)}.memory-body h2{font-family:var(--font-body);font-size:28px;letter-spacing:-.045em;margin-bottom:8px}.memory-body p{color:var(--muted);line-height:1.6;min-height:50px}.memory-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;color:var(--muted);font-size:13px}.memory-meta span{background:rgba(92,59,40,.08);padding:6px 9px;border-radius:999px}.card-actions{margin-top:18px;display:flex;gap:14px;align-items:center}.card-actions a,.copy-btn{border:0;background:transparent;color:var(--green);font-weight:900;cursor:pointer;font:inherit;font-size:14px}.footer{padding:70px 0 34px}.footer-box{border-radius:38px;padding:42px;background:radial-gradient(circle at 0% 0%,rgba(198,146,73,.18),transparent 32%),var(--green);color:#fffaf2;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;box-shadow:0 28px 70px rgba(23,60,52,.24)}.footer h2{font-family:var(--font-body);font-size:clamp(34px,4.4vw,60px);letter-spacing:-.06em;line-height:1;margin-bottom:12px}.footer p{color:rgba(255,250,242,.72);line-height:1.7;max-width:650px}.copyright{text-align:center;margin-top:28px;color:var(--muted);font-size:14px}.box-hero{display:grid;grid-template-columns:.95fr 1.05fr;gap:26px;align-items:stretch}.box-cover{border-radius:38px;min-height:520px;background-size:cover;background-position:center;box-shadow:var(--shadow);border:1px solid rgba(92,59,40,.12)}.box-detail{border-radius:38px;padding:34px;background:rgba(255,250,242,.72);border:1px solid rgba(92,59,40,.12);box-shadow:var(--shadow)}.box-detail h1{font-size:clamp(44px,5vw,72px)}.box-sub{color:var(--muted);line-height:1.6;margin-bottom:10px}.locked-note,.letter-paper{margin-top:24px;padding:26px;border-radius:28px;background:rgba(255,250,242,.82);border:1px solid rgba(92,59,40,.12)}.locked-note h2{font-family:var(--font-body);font-size:32px;letter-spacing:-.04em;margin-bottom:10px}.locked-note p,.letter-paper p{color:var(--muted);line-height:1.8;font-size:18px}.letter-paper p{font-family:var(--font-body);color:var(--brown-dark);font-size:23px}.album-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.album-item{height:220px;border-radius:24px;overflow:hidden;box-shadow:0 14px 38px rgba(92,59,40,.12);background:#ddd}.album-item img{width:100%;height:100%;object-fit:cover}.password-card{margin:0 auto}.real-form{align-items:stretch}@media(max-width:980px){.hero-grid,.create-box,.footer-box,.box-hero{grid-template-columns:1fr}.features,.box-grid{grid-template-columns:1fr 1fr}.album-grid{grid-template-columns:1fr 1fr}.memory-stage{min-height:auto}.date-card,.letter-card{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;margin-top:16px;transform:none}.big-card{transform:none}.dash-head{align-items:flex-start;flex-direction:column}.box-cover{min-height:380px}}@media(max-width:720px){.container{width:min(100% - 26px,1180px)}.nav-inner{border-radius:24px;align-items:flex-start}.nav-links{gap:10px;flex-wrap:wrap;justify-content:flex-end}.nav-links a:not(.nav-cta){display:none}.hero{padding:58px 0 44px}h1{font-size:54px}.hero-desc,.section-desc{font-size:16px}.photo-card{height:320px}.photo-card:after{font-size:30px}.section{padding:58px 0}.field-row,.features,.box-grid,.album-grid{grid-template-columns:1fr}.create-preview{min-height:420px}.footer-box{padding:28px}.memory-info{grid-template-columns:1fr}.box-detail{padding:24px}.album-item{height:260px}}

/* Full app modules */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0}.stat-card{display:block;background:rgba(255,250,242,.72);border:1px solid rgba(92,59,40,.12);border-radius:24px;padding:22px;box-shadow:0 14px 38px rgba(92,59,40,.08)}.stat-card strong{display:block;font-family:var(--font-body);font-size:42px;line-height:1;color:var(--green);letter-spacing:-.05em}.stat-card span{display:block;color:var(--muted);font-weight:800;margin-top:7px}.module-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:18px 0 38px}.module-card{background:var(--paper);border:1px solid rgba(92,59,40,.12);border-radius:28px;padding:24px;box-shadow:0 18px 46px rgba(92,59,40,.09);transition:.2s ease}.module-card:hover{transform:translateY(-3px)}.module-card span{width:46px;height:46px;display:grid;place-items:center;border-radius:16px;background:var(--green);color:#fffaf2;margin-bottom:18px;font-size:22px}.module-card h2{font-family:var(--font-body);font-size:26px;letter-spacing:-.04em;margin-bottom:8px}.module-card p,.muted{color:var(--muted);line-height:1.65}.dash-head.small h1{font-size:38px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel-card{background:rgba(255,250,242,.72);border:1px solid rgba(92,59,40,.12);border-radius:30px;padding:26px;box-shadow:0 18px 48px rgba(92,59,40,.08)}.mini-row{display:grid;grid-template-columns:105px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}.mini-row:last-of-type{border-bottom:0}.mini-row strong{color:var(--brown)}.mini-row p{color:var(--muted);margin-top:4px}.slim-box{grid-template-columns:1.15fr .85fr;align-items:stretch}.timeline-card.static{position:relative;top:0;min-height:100%;display:flex;flex-direction:column;justify-content:center}.timeline-line{display:grid;gap:16px}.big-moment{background:rgba(255,250,242,.72)}.letter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.letter-card-list{display:block;background:rgba(255,250,242,.74);border:1px solid rgba(92,59,40,.12);border-radius:30px;padding:26px;box-shadow:0 18px 46px rgba(92,59,40,.08)}.letter-card-list h2{font-family:var(--font-body);font-size:29px;letter-spacing:-.04em;margin:12px 0 8px}.letter-card-list p{color:var(--muted);line-height:1.6}.letter-card-list small{display:block;margin-top:20px;color:var(--brown);font-weight:850}.checkline{display:flex;gap:10px;align-items:center;color:var(--muted);font-weight:750}.big-letter{max-width:860px;margin:24px auto 0}.big-letter h1{font-size:58px}.memory-page-hero{display:grid;grid-template-columns:.92fr 1.08fr;gap:28px;align-items:stretch}.memory-page-cover{min-height:570px;border-radius:36px;background-size:cover;background-position:center;box-shadow:var(--shadow);border:1px solid rgba(92,59,40,.12)}.memory-page-info{background:rgba(255,250,242,.68);border:1px solid rgba(92,59,40,.12);border-radius:36px;padding:32px;box-shadow:0 18px 52px rgba(92,59,40,.09)}.memory-page-info h1{font-size:64px}.day-counter{display:flex;gap:18px;align-items:center;margin:20px 0;padding:18px;border-radius:24px;background:rgba(23,60,52,.08);border:1px solid rgba(23,60,52,.1)}.day-counter strong{font-family:var(--font-body);font-size:58px;line-height:1;color:var(--green);letter-spacing:-.06em}.day-counter span{color:var(--muted);font-weight:800}.guest-message{padding:16px 0;border-bottom:1px solid var(--line)}.guest-message:last-child{border-bottom:0}.guest-message strong{display:block}.guest-message small{display:block;color:var(--muted);margin:4px 0 9px}.guest-message p{color:var(--muted);line-height:1.65}.nav-links{flex-wrap:wrap}.nav-inner{border-radius:32px}.password-card label{display:grid;gap:8px;margin:18px 0}.password-card input{border:1px solid rgba(92,59,40,.14);background:rgba(255,250,242,.74);border-radius:18px;padding:15px 16px;color:var(--ink);outline:none;font:inherit}
@media (max-width:980px){.stats-grid,.module-grid,.letter-grid{grid-template-columns:1fr 1fr}.two-col,.slim-box,.memory-page-hero{grid-template-columns:1fr}.memory-page-cover{min-height:360px}.nav-links{display:none}}
@media (max-width:650px){.stats-grid,.module-grid,.letter-grid{grid-template-columns:1fr}.mini-row{grid-template-columns:1fr}.memory-page-info h1,.big-letter h1{font-size:42px}.day-counter strong{font-size:42px}}
.public-modules{grid-template-columns:repeat(4,1fr)}
.public-modules .module-card span{font-size:16px;font-weight:900;text-align:center;white-space:nowrap;overflow:hidden}
.mini-feature{min-height:auto;display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:start;padding:18px}.mini-feature .feature-icon{margin:0}.mini-feature h3{margin-bottom:6px}.mini-feature p{grid-column:2}.timeline-card.static .btn{margin-top:22px;width:max-content}
@media(max-width:1100px){.public-modules{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.public-modules{grid-template-columns:1fr}.mini-feature{grid-template-columns:1fr}.mini-feature p{grid-column:auto}.timeline-card.static .btn{width:100%}}



/* =========================
   Timeline page pro redesign
   ========================= */
.timeline-page{
  padding-top:6px;
}

.timeline-overview{
  display:grid;
  grid-template-columns:1.45fr .85fr .85fr .85fr;
  gap:18px;
  margin:0 0 28px;
}

.timeline-hero-card,
.timeline-stat-card,
.timeline-compose-card,
.timeline-helper-card,
.timeline-feed-wrap{
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.08);
}

.timeline-hero-card{
  border-radius:34px;
  padding:28px;
  background:
    radial-gradient(circle at top left, rgba(198,146,73,.14), transparent 30%),
    rgba(255,250,242,.78);
}

.timeline-hero-card__label{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(23,60,52,.08);
  color:var(--green);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:14px;
}

.timeline-hero-card h2{
  font-family:var(--font-body);
  font-size:38px;
  line-height:1.02;
  letter-spacing:-.05em;
  margin-bottom:12px;
}

.timeline-hero-card p{
  color:var(--muted);
  line-height:1.75;
  font-size:15.5px;
  max-width:680px;
}

.timeline-stat-card{
  border-radius:28px;
  padding:22px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:170px;
}

.timeline-stat-card span{
  color:var(--brown);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.1em;
  margin-bottom:12px;
}

.timeline-stat-card strong{
  font-family:var(--font-body);
  font-size:42px;
  line-height:1;
  letter-spacing:-.06em;
  color:var(--green);
  margin-bottom:8px;
}

.timeline-stat-card small{
  color:var(--muted);
  line-height:1.5;
  font-size:13px;
}

.timeline-layout{
  display:grid;
  grid-template-columns:400px 1fr;
  gap:24px;
  align-items:start;
}

.timeline-composer{
  position:sticky;
  top:110px;
  display:grid;
  gap:18px;
}

.timeline-compose-card{
  border-radius:34px;
  padding:26px;
}

.timeline-compose-head{
  margin-bottom:20px;
}

.timeline-compose-head h2{
  font-family:var(--font-body);
  font-size:42px;
  line-height:1;
  letter-spacing:-.055em;
  margin:8px 0 10px;
}

.timeline-compose-head p{
  color:var(--muted);
  line-height:1.7;
}

.timeline-form{
  gap:14px;
}

.timeline-form textarea{
  min-height:140px;
}

.timeline-submit{
  width:100%;
  margin-top:4px;
}

.timeline-helper-card{
  border-radius:28px;
  padding:22px 22px 18px;
}

.timeline-helper-card h3{
  font-family:var(--font-body);
  font-size:26px;
  letter-spacing:-.04em;
  margin-bottom:12px;
}

.timeline-helper-card ul{
  padding-left:18px;
  color:var(--muted);
  line-height:1.8;
  display:grid;
  gap:8px;
}

.timeline-feed-wrap{
  border-radius:34px;
  padding:26px;
  min-height:320px;
}

.timeline-feed-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:18px;
  padding-bottom:18px;
  margin-bottom:4px;
  border-bottom:1px solid var(--line);
}

.timeline-feed-head h2{
  font-family:var(--font-body);
  font-size:36px;
  line-height:1;
  letter-spacing:-.05em;
  margin-top:8px;
}

.timeline-feed-head p{
  color:var(--muted);
  font-weight:800;
  white-space:nowrap;
}

.timeline-feed{
  position:relative;
  display:grid;
  gap:26px;
  padding-top:20px;
}

.timeline-year-group{
  display:grid;
  grid-template-columns:112px 1fr;
  gap:18px;
  align-items:start;
}

.timeline-year-label{
  position:sticky;
  top:116px;
  display:grid;
  gap:6px;
  padding:14px 14px 15px;
  border-radius:22px;
  background:rgba(23,60,52,.08);
  border:1px solid rgba(23,60,52,.10);
  text-align:center;
}

.timeline-year-label span{
  font-family:var(--font-body);
  font-size:32px;
  line-height:1;
  color:var(--green);
  letter-spacing:-.055em;
}

.timeline-year-label small{
  color:var(--muted);
  font-weight:850;
}

.timeline-year-group > .timeline-entry{
  grid-column:2;
}

.timeline-entry{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:16px;
  align-items:start;
}

.timeline-entry__rail{
  position:relative;
  min-height:100%;
}

.timeline-entry__rail::after{
  content:"";
  position:absolute;
  left:16px;
  top:14px;
  bottom:-36px;
  width:2px;
  background:linear-gradient(180deg, rgba(23,60,52,.26), rgba(23,60,52,.04));
  border-radius:999px;
}

.timeline-year-group .timeline-entry:last-child .timeline-entry__rail::after{
  display:none;
}

.timeline-entry__dot{
  width:14px;
  height:14px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 6px rgba(23,60,52,.10);
  position:relative;
  top:8px;
  left:9px;
  display:block;
}

.timeline-entry__card{
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.56), rgba(255,255,255,.25));
  border:1px solid rgba(92,59,40,.10);
  border-radius:28px;
  box-shadow:0 14px 34px rgba(92,59,40,.06);
}

.timeline-entry__card.has-cover{
  display:grid;
  grid-template-columns:220px 1fr;
  min-height:250px;
}

.timeline-entry__cover{
  min-height:250px;
  background-size:cover;
  background-position:center;
  position:relative;
}

.timeline-entry__cover::after{
  content:"Mở ảnh";
  position:absolute;
  left:14px;
  bottom:14px;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(255,250,242,.82);
  color:var(--brown-dark);
  font-size:12px;
  font-weight:900;
  backdrop-filter:blur(10px);
}

.timeline-entry__body{
  padding:22px;
}

.timeline-entry__top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  flex-wrap:wrap;
}

.timeline-date-pill{
  display:inline-flex;
  align-items:center;
  padding:9px 13px;
  border-radius:999px;
  background:rgba(23,60,52,.08);
  color:var(--green);
  font-size:13px;
  font-weight:900;
  letter-spacing:.02em;
}

.timeline-related-box{
  display:inline-flex;
  align-items:center;
  padding:9px 13px;
  border-radius:999px;
  background:rgba(198,146,73,.14);
  color:var(--brown-dark);
  font-size:13px;
  font-weight:800;
}

.timeline-entry__card h3{
  font-family:var(--font-body);
  font-size:32px;
  line-height:1.06;
  letter-spacing:-.045em;
  margin-bottom:10px;
}

.timeline-entry__content{
  color:var(--muted);
  line-height:1.8;
  font-size:15.5px;
}

.timeline-entry__meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.timeline-entry__meta span{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(92,59,40,.08);
  color:var(--muted);
  font-size:12.5px;
  font-weight:800;
}

.timeline-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:12px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--line);
}

.timeline-edit{
  flex:1 1 100%;
}

.timeline-edit summary{
  width:max-content;
  list-style:none;
  cursor:pointer;
  border:0;
  border-radius:999px;
  padding:10px 14px;
  background:var(--green);
  color:#fffaf2;
  font-size:13px;
  font-weight:900;
}

.timeline-edit summary::-webkit-details-marker{
  display:none;
}

.timeline-edit[open] summary{
  margin-bottom:16px;
}

.timeline-edit-form{
  display:grid;
  gap:14px;
  padding:18px;
  border-radius:24px;
  background:rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.10);
}

.timeline-delete-btn{
  cursor:pointer;
  border:0;
  border-radius:999px;
  padding:10px 14px;
  background:rgba(150,48,36,.10);
  color:#7b271e;
  font:inherit;
  font-size:13px;
  font-weight:900;
}

.timeline-empty{
  margin-top:12px;
}

@media (max-width:1180px){
  .timeline-entry__card.has-cover{
    grid-template-columns:1fr;
  }

  .timeline-entry__cover{
    min-height:280px;
  }
}

@media (max-width:1100px){
  .timeline-overview{
    grid-template-columns:1fr 1fr;
  }

  .timeline-layout{
    grid-template-columns:1fr;
  }

  .timeline-composer,
  .timeline-year-label{
    position:relative;
    top:0;
  }
}

@media (max-width:760px){
  .timeline-overview{
    grid-template-columns:1fr;
  }

  .timeline-feed-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .timeline-year-group{
    grid-template-columns:1fr;
  }

  .timeline-year-group > .timeline-entry{
    grid-column:1;
  }

  .timeline-year-label{
    text-align:left;
    display:flex;
    justify-content:space-between;
    align-items:center;
  }

  .timeline-entry{
    grid-template-columns:24px 1fr;
    gap:12px;
  }

  .timeline-entry__rail::after{
    left:11px;
  }

  .timeline-entry__dot{
    left:4px;
  }

  .timeline-compose-head h2,
  .timeline-feed-head h2{
    font-size:30px;
  }

  .timeline-entry__card h3{
    font-size:26px;
  }
}



/* =========================
   Memory page beauty redesign
   ========================= */
.page-beauty{
  padding-top:52px;
}

.keepsake-hero{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:28px;
  align-items:stretch;
}

.keepsake-photo-wrap{
  position:relative;
  min-height:560px;
}

.keepsake-photo{
  position:relative;
  display:block;
  height:100%;
  min-height:560px;
  border-radius:42px;
  background-size:cover;
  background-position:center;
  border:1px solid rgba(92,59,40,.14);
  box-shadow:0 30px 90px rgba(92,59,40,.22);
  overflow:hidden;
}

.keepsake-photo::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(31,35,32,.02), rgba(31,35,32,.34)),
    radial-gradient(circle at 20% 15%, rgba(255,250,242,.24), transparent 32%);
}

.keepsake-photo span{
  position:absolute;
  left:24px;
  bottom:24px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,250,242,.84);
  color:var(--brown-dark);
  font-size:13px;
  font-weight:950;
  backdrop-filter:blur(14px);
  box-shadow:0 12px 32px rgba(31,35,32,.12);
}

.keepsake-tape{
  position:absolute;
  width:92px;
  height:30px;
  border-radius:5px;
  background:rgba(198,146,73,.30);
  border:1px solid rgba(140,100,70,.16);
  z-index:2;
  backdrop-filter:blur(2px);
}

.tape-one{
  top:-10px;
  left:74px;
  transform:rotate(-10deg);
}

.tape-two{
  right:64px;
  bottom:-8px;
  transform:rotate(8deg);
}

.keepsake-card{
  position:relative;
  overflow:hidden;
  border-radius:42px;
  padding:38px;
  background:
    radial-gradient(circle at 100% 0%, rgba(198,146,73,.14), transparent 30%),
    rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 24px 72px rgba(92,59,40,.12);
}

.keepsake-card::after{
  content:"10ngan5";
  position:absolute;
  right:-20px;
  bottom:-18px;
  font-family:var(--font-body);
  font-size:98px;
  line-height:1;
  letter-spacing:-.08em;
  color:rgba(92,59,40,.06);
  pointer-events:none;
}

.keepsake-label-row{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-bottom:16px;
}

.keepsake-pill,
.keepsake-privacy{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:9px 13px;
  font-size:12px;
  font-weight:950;
}

.keepsake-pill{
  background:rgba(23,60,52,.10);
  color:var(--green);
}

.keepsake-privacy{
  background:rgba(198,146,73,.14);
  color:var(--brown-dark);
}

.keepsake-card h1{
  font-size:clamp(54px,6vw,92px);
  line-height:.88;
  margin-bottom:22px;
  max-width:720px;
}

.keepsake-names{
  color:var(--muted);
  font-size:18px;
  font-weight:850;
  letter-spacing:.08em;
  margin-bottom:22px;
}

.keepsake-counter{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-radius:30px;
  padding:24px;
  margin:20px 0;
  background:
    linear-gradient(135deg, rgba(23,60,52,.11), rgba(198,146,73,.08));
  border:1px solid rgba(23,60,52,.12);
}

.keepsake-counter div{
  display:flex;
  align-items:flex-end;
  gap:12px;
}

.keepsake-counter strong{
  font-family:var(--font-body);
  font-size:68px;
  line-height:.85;
  letter-spacing:-.075em;
  color:var(--green);
}

.keepsake-counter span{
  color:var(--muted);
  font-weight:950;
  padding-bottom:8px;
}

.keepsake-counter p{
  color:var(--brown-dark);
  font-weight:900;
  white-space:nowrap;
}

.keepsake-mini-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:18px 0 26px;
}

.keepsake-mini-stats div{
  border-radius:24px;
  padding:18px;
  background:rgba(255,250,242,.68);
  border:1px solid rgba(92,59,40,.10);
}

.keepsake-mini-stats strong{
  display:block;
  font-family:var(--font-body);
  font-size:34px;
  line-height:1;
  letter-spacing:-.06em;
  color:var(--brown-dark);
}

.keepsake-mini-stats span{
  display:block;
  color:var(--muted);
  font-size:13px;
  font-weight:850;
  margin-top:6px;
}

.keepsake-actions{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.story-strip{
  margin-top:32px;
  display:grid;
  grid-template-columns:94px 1fr;
  gap:22px;
  align-items:stretch;
  border-radius:38px;
  padding:26px;
  background:
    linear-gradient(135deg, rgba(255,250,242,.82), rgba(255,250,242,.58));
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 54px rgba(92,59,40,.10);
}

.story-strip__icon{
  min-height:140px;
  border-radius:28px;
  display:grid;
  place-items:center;
  background:var(--green);
  color:#fffaf2;
  font-size:38px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}

.story-strip article{
  border-radius:28px;
  padding:28px;
  background:rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.09);
}

.story-strip p{
  font-family:var(--font-body);
  font-size:26px;
  line-height:1.62;
  color:var(--brown-dark);
  margin-top:8px;
}

.guestbook-layout{
  margin-top:32px;
  display:grid;
  grid-template-columns:420px 1fr;
  gap:24px;
  align-items:start;
}

.guestbook-form,
.guestbook-wall{
  border-radius:38px;
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 20px 58px rgba(92,59,40,.09);
}

.guestbook-form{
  position:sticky;
  top:110px;
  padding:28px;
}

.guestbook-form__head{
  margin-bottom:22px;
}

.guestbook-form__head h2,
.guestbook-wall__head h2{
  font-family:var(--font-body);
  font-size:38px;
  line-height:1;
  letter-spacing:-.055em;
  margin:8px 0 10px;
}

.guestbook-form__head p{
  color:var(--muted);
  line-height:1.7;
}

.guestbook-wall{
  padding:28px;
}

.guestbook-wall__head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:end;
  padding-bottom:18px;
  border-bottom:1px solid var(--line);
  margin-bottom:22px;
}

.guestbook-wall__head span{
  color:var(--muted);
  font-weight:850;
  text-align:right;
}

.guestbook-empty{
  border-radius:28px;
  padding:30px;
  background:rgba(92,59,40,.06);
  color:var(--muted);
}

.guestbook-empty h3{
  font-family:var(--font-body);
  font-size:30px;
  letter-spacing:-.04em;
  color:var(--ink);
  margin-bottom:8px;
}

.guest-message-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}

.guest-note{
  position:relative;
  border-radius:26px;
  padding:26px 22px 22px;
  background:rgba(255,250,242,.92);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 42px rgba(92,59,40,.08);
}

.guest-note.tilt-left{
  transform:rotate(-.6deg);
}

.guest-note.tilt-right{
  transform:rotate(.6deg);
}

.guest-note__pin{
  position:absolute;
  top:-8px;
  left:50%;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 4px 12px rgba(92,59,40,.22);
}

.guest-note strong{
  display:block;
  font-family:var(--font-body);
  font-size:24px;
  letter-spacing:-.04em;
  color:var(--ink);
}

.guest-note small{
  display:block;
  color:var(--muted);
  margin:6px 0 12px;
  font-weight:750;
}

.guest-note p{
  color:var(--muted);
  line-height:1.72;
}

.memorial-theme .keepsake-photo span,
.memorial-theme .keepsake-pill{
  background:rgba(255,250,242,.88);
  color:var(--brown-dark);
}

.memorial-theme .story-strip__icon{
  background:linear-gradient(145deg, #5c3b28, #173c34);
}

@media(max-width:1080px){
  .keepsake-hero,
  .guestbook-layout{
    grid-template-columns:1fr;
  }

  .guestbook-form{
    position:relative;
    top:0;
  }

  .keepsake-photo-wrap,
  .keepsake-photo{
    min-height:480px;
  }
}

@media(max-width:760px){
  .page-beauty{
    padding-top:30px;
  }

  .keepsake-card{
    padding:26px;
  }

  .keepsake-counter{
    align-items:flex-start;
    flex-direction:column;
  }

  .keepsake-counter div{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }

  .keepsake-counter strong{
    font-size:54px;
  }

  .keepsake-counter p{
    white-space:normal;
  }

  .keepsake-mini-stats,
  .guest-message-grid{
    grid-template-columns:1fr;
  }

  .story-strip{
    grid-template-columns:1fr;
  }

  .story-strip__icon{
    min-height:76px;
  }

  .story-strip p{
    font-size:21px;
  }

  .guestbook-wall__head{
    flex-direction:column;
    align-items:flex-start;
  }

  .guestbook-wall__head span{
    text-align:left;
  }
}


/* Global typography font fix */
body,input,textarea,select,button{font-family:var(--font-body)}
h1,h2,h3,h4,h5,h6,.section-title,.brand,.hero-title-accent,.memory-v3-title,.keepsake-card h1,.timeline-entry__card h3{font-feature-settings:"liga" 1,"kern" 1;text-rendering:optimizeLegibility}



/* =========================================================
   GLOBAL FONT RESET V2 - Vietnamese-safe across all pages
   Dùng Be Vietnam Pro cho toàn bộ chữ, bỏ serif để không vỡ dấu.
   ========================================================= */
:root{
  --font-body:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif;
  --font-display:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif;
}

html,body,
input,textarea,select,button,
a,p,span,small,strong,label,li,
h1,h2,h3,h4,h5,h6,
.section-title,
.memory-info h3,
.photo-card:after,
.date-card strong,
.letter-card p,
.feature h3,
.empty-card h2,
.form-card h2,
.create-preview-content h3,
.price-card h3,
.footer h2,
.box-detail h1,
.locked-note h2,
.letter-paper p,
.stat-card strong,
.module-card h2,
.letter-card-list h2,
.big-letter h1,
.memory-page-info h1,
.day-counter strong,
.timeline-hero-card h2,
.timeline-stat-card strong,
.timeline-compose-head h2,
.timeline-helper-card h3,
.timeline-feed-head h2,
.timeline-year-label span,
.timeline-entry__card h3,
.memory-v3-title,
.memory-v3-counter strong,
.memory-v3-stat strong,
.memory-v3-story-card p,
.memory-v3-form h2,
.memory-v3-wall h2,
.memory-v3-empty h3,
.memory-v3-note strong{
  font-family:var(--font-body)!important;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"kern" 1,"liga" 1;
}

/* Giảm độ méo của tiêu đề lớn trên tiếng Việt */
h1,
.section-title,
.hero h1,
.dash-head h1,
.memory-v3-title,
.timeline-compose-head h2,
.timeline-feed-head h2,
.timeline-entry__card h3,
.memory-v3-form h2,
.memory-v3-wall h2{
  letter-spacing:-.045em!important;
  line-height:1.02!important;
  font-weight:900!important;
}

/* Trang chủ: tránh title quá nặng và bị đè dấu */
.hero h1{
  font-size:clamp(44px,6.2vw,82px)!important;
  max-width:760px;
}

h1 em,
.hero-title-accent{
  font-family:var(--font-body)!important;
  font-style:normal!important;
  color:var(--brown)!important;
  font-weight:800!important;
}

/* Các title phụ vẫn giữ cảm giác mềm nhưng không dùng serif */
.section-title{
  font-size:clamp(34px,4.1vw,58px)!important;
}

.feature h3,
.module-card h2,
.price-card h3,
.memory-body h2,
.timeline-entry__card h3{
  letter-spacing:-.035em!important;
}

/* Memory page v3 riêng */
.memory-v3-title{
  font-size:clamp(48px,6vw,88px)!important;
}

.memory-v3-story-card p{
  font-size:23px!important;
  letter-spacing:-.02em!important;
  line-height:1.62!important;
  font-weight:600!important;
}

.memory-v3-counter strong{
  letter-spacing:-.055em!important;
}

.memory-v3-note strong{
  letter-spacing:-.025em!important;
}

/* Fix một số chữ bị lọt mép khi quá to */
.hero,
.section,
.memory-v3,
.page{
  overflow-wrap:anywhere;
}

.brand{
  letter-spacing:-.035em!important;
}

/* Mobile */
@media(max-width:720px){
  .hero h1{
    font-size:44px!important;
  }

  .memory-v3-title{
    font-size:42px!important;
  }

  .section-title{
    font-size:34px!important;
  }
}


/* FONT FORCE V3 - fallback nếu inline header bị bỏ qua */
html body,
html body *,
html body input,
html body textarea,
html body select,
html body button{
  font-family:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif!important;
}

html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6{
  font-family:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  letter-spacing:-.035em!important;
  line-height:1.04!important;
}




/* =========================================================
   10ngan5 - Five feature pack styles
   ========================================================= */
.stats-grid-five{
  grid-template-columns:repeat(5,1fr);
}

.module-grid-six{
  grid-template-columns:repeat(3,1fr);
}

.daily-nudge{
  margin:22px 0 38px;
  padding:28px;
  border-radius:34px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:22px;
  background:
    radial-gradient(circle at 0% 0%, rgba(198,146,73,.18), transparent 32%),
    rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.09);
}

.daily-nudge h2{
  font-size:32px;
  line-height:1.1;
  margin:6px 0 8px;
}

.daily-nudge p{
  color:var(--muted);
  line-height:1.65;
}

.today-layout{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:24px;
  align-items:stretch;
}

.today-card,
.today-prompt,
.random-card,
.qr-card,
.pages-builder,
.pages-builder-preview,
.step-card{
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.09);
}

.today-card{
  border-radius:36px;
  padding:28px;
}

.today-card-head{
  margin-bottom:22px;
}

.today-card-head span{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(23,60,52,.10);
  color:var(--green);
  font-weight:900;
  font-size:12px;
  margin-bottom:12px;
}

.today-card-head h2,
.today-prompt h2,
.random-content h2,
.qr-card h2,
.pages-builder-preview h2,
.step-card h2{
  font-size:36px;
  line-height:1.06;
  margin-bottom:10px;
}

.today-card-head p,
.today-prompt p,
.random-content p,
.qr-card p,
.pages-builder-preview p{
  color:var(--muted);
  line-height:1.75;
}

.today-prompt{
  border-radius:36px;
  padding:28px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:
    radial-gradient(circle at 100% 0%, rgba(23,60,52,.12), transparent 34%),
    rgba(255,250,242,.78);
}

.prompt-list{
  margin-top:20px;
  display:grid;
  gap:12px;
}

.prompt-list button{
  cursor:pointer;
  text-align:left;
  border:1px solid rgba(92,59,40,.12);
  background:rgba(255,250,242,.72);
  border-radius:20px;
  padding:16px 18px;
  color:var(--brown-dark);
  font-weight:850;
}

.today-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.dashboard-today-grid{
  grid-template-columns:repeat(4,1fr);
}

.today-entry-card{
  overflow:hidden;
  border-radius:30px;
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 44px rgba(92,59,40,.08);
}

.today-entry-image{
  display:block;
  height:210px;
  background-size:cover;
  background-position:center;
}

.today-entry-body{
  padding:20px;
}

.today-entry-body p{
  color:var(--muted);
  line-height:1.72;
  margin-top:14px;
}

.random-card{
  border-radius:40px;
  overflow:hidden;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  min-height:560px;
}

.random-cover{
  background-size:cover;
  background-position:center;
  min-height:560px;
}

.random-content{
  padding:42px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.random-content h2{
  font-size:54px;
  letter-spacing:-.05em;
}

.random-content p{
  font-size:18px;
  margin:12px 0 28px;
}

.random-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.qr-card{
  border-radius:40px;
  padding:34px;
  display:grid;
  grid-template-columns:320px 1fr;
  gap:34px;
  align-items:center;
}

.qr-art{
  display:grid;
  place-items:center;
  padding:24px;
  border-radius:32px;
  background:rgba(255,250,242,.86);
  border:1px solid rgba(92,59,40,.12);
}

.qr-art svg{
  max-width:100%;
  height:auto;
  filter:drop-shadow(0 16px 34px rgba(92,59,40,.12));
}

.pages-builder{
  border-radius:40px;
  padding:22px;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:22px;
  align-items:stretch;
}

.pages-builder-form{
  display:grid;
  gap:18px;
}

.step-card{
  border-radius:30px;
  padding:24px;
}

.step-card > span{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(23,60,52,.10);
  color:var(--green);
  font-size:12px;
  font-weight:950;
  margin-bottom:12px;
}

.type-picker{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.type-picker label{
  cursor:pointer;
  display:grid;
  gap:6px;
  border:1px solid rgba(92,59,40,.12);
  background:rgba(255,250,242,.72);
  border-radius:24px;
  padding:18px;
}

.type-picker input{
  width:max-content;
}

.type-picker b{
  color:var(--ink);
}

.type-picker small{
  color:var(--muted);
  line-height:1.5;
}

.pages-builder-preview{
  border-radius:34px;
  padding:30px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:
    radial-gradient(circle at 100% 0%, rgba(198,146,73,.18), transparent 30%),
    var(--green);
  color:#fffaf2;
}

.pages-builder-preview .section-kicker,
.pages-builder-preview p{
  color:rgba(255,250,242,.74);
}

.preview-mini-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:22px;
}

.preview-mini-list span{
  border-radius:18px;
  padding:13px;
  background:rgba(255,250,242,.10);
  border:1px solid rgba(255,250,242,.14);
  font-weight:850;
}

.quick-wish-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
  margin-top:16px;
}

.quick-wish-form input{
  min-width:0;
  border:1px solid rgba(92,59,40,.14);
  background:rgba(255,250,242,.74);
  border-radius:999px;
  padding:12px 14px;
  outline:none;
}

.quick-wish-form button{
  border:0;
  cursor:pointer;
  border-radius:999px;
  padding:12px 14px;
  background:var(--green);
  color:#fffaf2;
  font-weight:900;
}

.wish-list-small{
  display:grid;
  gap:8px;
  margin-top:12px;
}

.wish-list-small form{
  margin:0;
}

.wish-list-small button{
  width:100%;
  cursor:pointer;
  border:1px solid rgba(92,59,40,.10);
  background:rgba(92,59,40,.06);
  color:var(--muted);
  border-radius:16px;
  padding:10px 12px;
  text-align:left;
  font-weight:800;
}

.wish-list-small button.done{
  background:rgba(23,60,52,.10);
  color:var(--green);
  text-decoration:line-through;
}

.letter-template-section{
  margin-bottom:28px;
}

.letter-template-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}

.letter-template-card{
  display:block;
  border-radius:26px;
  padding:20px;
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 14px 38px rgba(92,59,40,.07);
}

.letter-template-card.active{
  border-color:rgba(23,60,52,.35);
  box-shadow:0 0 0 4px rgba(23,60,52,.08), 0 14px 38px rgba(92,59,40,.07);
}

.letter-template-card span{
  display:inline-flex;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
  font-size:11px;
  font-weight:950;
  margin-bottom:12px;
}

.letter-template-card h2{
  font-size:22px;
  line-height:1.15;
  margin-bottom:8px;
}

.letter-template-card p{
  color:var(--muted);
  line-height:1.6;
  font-size:13px;
}

.box-owner-actions{
  margin:18px 0;
}

@media(max-width:1100px){
  .stats-grid-five,
  .module-grid-six,
  .today-grid,
  .dashboard-today-grid,
  .letter-template-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .today-layout,
  .random-card,
  .qr-card,
  .pages-builder{
    grid-template-columns:1fr;
  }

  .random-cover{
    min-height:360px;
  }
}

@media(max-width:700px){
  .stats-grid-five,
  .module-grid-six,
  .today-grid,
  .dashboard-today-grid,
  .letter-template-grid,
  .type-picker,
  .preview-mini-list{
    grid-template-columns:1fr;
  }

  .daily-nudge{
    flex-direction:column;
    align-items:flex-start;
  }

  .qr-card{
    padding:22px;
  }

  .random-content{
    padding:26px;
  }

  .random-content h2{
    font-size:34px;
  }

  .quick-wish-form{
    grid-template-columns:1fr;
  }
}




/* =========================================================
   Future letters UI redesign
   ========================================================= */
.future-letters-page{
  padding-top:70px;
}

.future-letters-hero{
  display:grid;
  grid-template-columns:1fr 190px auto;
  gap:24px;
  align-items:end;
  margin-bottom:34px;
}

.future-letters-hero h1{
  font-size:clamp(46px,5.6vw,76px)!important;
  line-height:1.02!important;
  margin-bottom:14px;
}

.future-letters-hero p{
  color:var(--muted);
  line-height:1.75;
  font-size:17px;
  max-width:760px;
}

.future-letters-hero-card{
  min-height:142px;
  border-radius:30px;
  padding:24px;
  background:var(--green);
  color:#fffaf2;
  box-shadow:0 22px 60px rgba(23,60,52,.20);
}

.future-letters-hero-card span{
  display:block;
  font-size:46px;
  line-height:1;
  font-weight:950;
}

.future-letters-hero-card strong{
  display:block;
  margin-top:6px;
  font-size:15px;
}

.future-letters-hero-card small{
  display:block;
  margin-top:10px;
  color:rgba(255,250,242,.68);
  line-height:1.45;
}

.future-template-section{
  margin-bottom:30px;
}

.future-section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:20px;
  margin-bottom:18px;
}

.future-section-head h2{
  font-size:36px;
  line-height:1.08;
  margin:6px 0 0;
}

.future-section-head p{
  color:var(--muted);
  line-height:1.65;
  max-width:520px;
}

.future-template-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}

.future-template-card{
  min-height:230px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:18px;
  border-radius:30px;
  padding:22px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 16px 44px rgba(92,59,40,.08);
  transition:.2s ease;
}

.future-template-card:hover,
.future-template-card.active{
  transform:translateY(-3px);
  border-color:rgba(23,60,52,.32);
  box-shadow:0 0 0 4px rgba(23,60,52,.08), 0 18px 48px rgba(92,59,40,.10);
}

.future-template-icon{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:var(--green);
  color:#fffaf2;
  font-weight:950;
  box-shadow:0 14px 28px rgba(23,60,52,.16);
}

.future-template-card span{
  display:inline-flex;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
  font-size:11px;
  font-weight:950;
  margin-bottom:10px;
}

.future-template-card h3{
  font-size:22px;
  line-height:1.15;
  margin-bottom:8px;
}

.future-template-card p{
  color:var(--muted);
  line-height:1.6;
  font-size:13.5px;
}

.future-write-layout{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
  align-items:stretch;
}

.future-write-card,
.future-write-side{
  border-radius:38px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 22px 64px rgba(92,59,40,.10);
}

.future-write-card{
  padding:30px;
}

.future-write-head{
  margin-bottom:22px;
}

.future-write-head h2{
  font-size:42px;
  line-height:1.04;
  margin:8px 0 10px;
}

.future-write-head p{
  color:var(--muted);
  line-height:1.7;
  max-width:620px;
}

.future-letter-textarea{
  min-height:250px!important;
  line-height:1.75;
}

.future-checkline{
  padding:13px 14px;
  border-radius:18px;
  background:rgba(23,60,52,.07);
  border:1px solid rgba(23,60,52,.10);
}

.future-write-side{
  padding:28px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 0%, rgba(198,146,73,.18), transparent 32%),
    rgba(255,250,242,.82);
}

.future-envelope{
  width:min(100%,460px);
  min-height:410px;
  position:relative;
  display:grid;
  place-items:end center;
  border-radius:34px;
  padding:32px;
  background:
    linear-gradient(145deg, rgba(23,60,52,.16), rgba(198,146,73,.10)),
    rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.12);
}

.future-envelope-flap{
  position:absolute;
  top:32px;
  left:32px;
  right:32px;
  height:145px;
  border-radius:26px 26px 10px 10px;
  background:rgba(198,146,73,.22);
  transform:skewY(-5deg);
  transform-origin:left;
}

.future-envelope-content{
  position:relative;
  z-index:1;
  width:100%;
  border-radius:28px;
  padding:28px;
  background:rgba(255,250,242,.90);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 24px 50px rgba(92,59,40,.12);
}

.future-envelope-content span{
  display:inline-flex;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(23,60,52,.10);
  color:var(--green);
  font-size:12px;
  font-weight:950;
  margin-bottom:14px;
}

.future-envelope-content h2{
  font-size:30px;
  line-height:1.12;
  margin-bottom:12px;
}

.future-envelope-content p{
  color:var(--muted);
  line-height:1.7;
}

.future-letter-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.future-letter-card{
  display:block;
  min-height:240px;
  border-radius:32px;
  padding:24px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.08);
}

.future-letter-card h2{
  font-size:28px;
  line-height:1.12;
  margin:12px 0 10px;
}

.future-letter-card p{
  color:var(--muted);
}

.future-letter-card small{
  display:block;
  margin-top:22px;
  color:var(--brown);
  font-weight:850;
}

.future-letter-read{
  max-width:920px;
  margin:24px auto 0;
  border-radius:40px;
  padding:42px;
  background:rgba(255,250,242,.86);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 24px 70px rgba(92,59,40,.12);
}

.future-letter-read h1{
  font-size:clamp(42px,5vw,68px)!important;
  margin-bottom:14px;
}

.future-letter-content{
  margin-top:26px;
  border-radius:30px;
  padding:30px;
  background:rgba(92,59,40,.06);
  color:var(--brown-dark);
  font-size:20px;
  line-height:1.85;
}

@media(max-width:1100px){
  .future-letters-hero,
  .future-write-layout{
    grid-template-columns:1fr;
  }

  .future-template-grid,
  .future-letter-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .future-letters-hero-card{
    max-width:260px;
  }
}

@media(max-width:700px){
  .future-letters-page{
    padding-top:44px;
  }

  .future-template-grid,
  .future-letter-grid{
    grid-template-columns:1fr;
  }

  .future-section-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .future-write-card{
    padding:22px;
  }

  .future-write-head h2{
    font-size:32px;
  }

  .future-envelope{
    min-height:340px;
    padding:20px;
  }
}




/* =========================================================
   Admin + Pricing + Plan system
   ========================================================= */
.admin-page .dash-head,
.pricing-page .dash-head{
  align-items:flex-start;
}

.admin-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}

.admin-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin:24px 0 36px;
}

.admin-table-wrap{
  width:100%;
  overflow:auto;
  border-radius:28px;
  border:1px solid rgba(92,59,40,.12);
  background:rgba(255,250,242,.78);
  box-shadow:0 18px 48px rgba(92,59,40,.08);
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  min-width:760px;
}

.admin-table th,
.admin-table td{
  padding:16px;
  text-align:left;
  border-bottom:1px solid var(--line);
  vertical-align:top;
}

.admin-table th{
  color:var(--brown);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:950;
}

.admin-table td b{
  display:block;
  margin-bottom:4px;
}

.admin-table td small{
  display:block;
  color:var(--muted);
  line-height:1.5;
}

.admin-badge{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:7px 10px;
  font-size:12px;
  font-weight:950;
  background:rgba(92,59,40,.08);
  color:var(--muted);
  margin:2px;
}

.admin-badge.active,
.admin-badge.approved,
.admin-badge.admin{
  background:rgba(23,60,52,.10);
  color:var(--green);
}

.admin-badge.suspended,
.admin-badge.rejected{
  background:rgba(150,48,36,.10);
  color:#7b271e;
}

.admin-badge.pending{
  background:rgba(198,146,73,.18);
  color:var(--brown-dark);
}

.admin-filter{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  margin-bottom:22px;
}

.admin-filter input,
.admin-inline-form input,
.admin-inline-form select,
.admin-plan-form input,
.admin-plan-form textarea,
.admin-plan-card input,
.admin-plan-card textarea,
.admin-plan-card select,
.upgrade-admin-actions textarea,
.upgrade-card textarea,
.upgrade-card input{
  border:1px solid rgba(92,59,40,.14);
  background:rgba(255,250,242,.76);
  border-radius:16px;
  padding:12px 14px;
  outline:none;
  color:var(--ink);
}

.admin-inline-form{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr auto;
  gap:8px;
  min-width:720px;
}

.admin-plan-form{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
  align-items:center;
}

.admin-plan-form label,
.admin-check-grid label,
.upgrade-cycle-grid label{
  display:flex;
  gap:8px;
  align-items:center;
  font-weight:850;
  color:var(--muted);
}

.admin-plan-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
  margin-top:22px;
}

.admin-plan-card form{
  display:grid;
  gap:14px;
}

.admin-plan-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:start;
}

.admin-plan-head span{
  display:inline-flex;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(23,60,52,.10);
  color:var(--green);
  font-size:12px;
  font-weight:950;
  margin-bottom:8px;
}

.admin-plan-head input{
  font-size:28px;
  font-weight:950;
  width:100%;
}

.admin-plan-card textarea{
  min-height:90px;
  resize:vertical;
}

.admin-plan-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}

.admin-plan-grid label{
  display:grid;
  gap:6px;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
}

.admin-check-grid{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

.admin-filter-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:22px;
}

.admin-filter-tabs a{
  border-radius:999px;
  padding:11px 15px;
  background:rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.12);
  color:var(--muted);
  font-weight:900;
}

.admin-filter-tabs a.active{
  background:var(--green);
  color:#fffaf2;
}

.upgrade-request-list{
  display:grid;
  gap:16px;
}

.upgrade-request-card{
  display:grid;
  grid-template-columns:1fr 360px;
  gap:20px;
  border-radius:32px;
  padding:24px;
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.08);
}

.upgrade-request-card h2{
  font-size:30px;
  line-height:1.1;
  margin:8px 0;
}

.admin-note{
  margin-top:14px;
  color:var(--muted);
  line-height:1.65;
}

.upgrade-admin-actions{
  display:grid;
  gap:12px;
}

.upgrade-admin-actions textarea{
  min-height:110px;
}

.upgrade-admin-actions div{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.pricing-plan-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:18px;
}

.pricing-plan-card{
  display:flex;
  flex-direction:column;
  gap:20px;
  border-radius:34px;
  padding:24px;
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.08);
}

.pricing-plan-card.active{
  border-color:rgba(23,60,52,.35);
  box-shadow:0 0 0 4px rgba(23,60,52,.08),0 18px 48px rgba(92,59,40,.08);
}

.plan-top span{
  display:inline-flex;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
  font-size:11px;
  font-weight:950;
  margin-bottom:12px;
}

.plan-top h2{
  font-size:30px;
  margin-bottom:8px;
}

.plan-top p{
  color:var(--muted);
  line-height:1.6;
  font-size:14px;
}

.plan-price strong{
  font-size:32px;
  letter-spacing:-.04em;
}

.plan-price span{
  color:var(--muted);
  font-weight:800;
}

.plan-features{
  list-style:none;
  display:grid;
  gap:10px;
  color:var(--muted);
  font-size:14px;
  flex:1;
}

.plan-features li:before{
  content:"✦";
  color:var(--gold);
  margin-right:8px;
}

.current-plan-banner{
  margin-bottom:24px;
  border-radius:30px;
  padding:22px;
  background:var(--green);
  color:#fffaf2;
  box-shadow:0 20px 50px rgba(23,60,52,.20);
}

.current-plan-banner span{
  display:block;
  color:rgba(255,250,242,.72);
  font-weight:850;
}

.current-plan-banner strong{
  display:block;
  font-size:32px;
  margin:4px 0;
}

.current-plan-banner p{
  color:rgba(255,250,242,.72);
}

.upgrade-card{
  max-width:760px;
  margin:0 auto;
  border-radius:38px;
  padding:34px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 22px 64px rgba(92,59,40,.10);
  display:grid;
  gap:20px;
}

.upgrade-card h1{
  font-size:52px!important;
}

.upgrade-card p{
  color:var(--muted);
  line-height:1.7;
}

.upgrade-cycle-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.upgrade-cycle-grid label{
  border-radius:24px;
  padding:18px;
  background:rgba(255,250,242,.74);
  border:1px solid rgba(92,59,40,.12);
}

.upgrade-cycle-grid b,
.upgrade-cycle-grid span{
  display:block;
}

.upgrade-note{
  border-radius:24px;
  padding:18px;
  background:rgba(23,60,52,.08);
  border:1px solid rgba(23,60,52,.10);
}

@media(max-width:1200px){
  .pricing-plan-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .admin-plan-list,
  .upgrade-request-card{
    grid-template-columns:1fr;
  }

  .admin-plan-form,
  .admin-plan-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:900px){
  .admin-stat-grid,
  .pricing-plan-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:650px){
  .admin-stat-grid,
  .pricing-plan-grid,
  .admin-plan-form,
  .admin-plan-grid,
  .upgrade-cycle-grid{
    grid-template-columns:1fr;
  }

  .admin-filter{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   Admin pages redesign v2
   ========================================================= */
.admin-shell{
  display:grid;
  gap:24px;
}

.admin-hero{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  padding:8px 0 4px;
}

.admin-hero h1{
  font-size:clamp(46px,5vw,74px)!important;
  line-height:1.02!important;
  margin:6px 0 14px;
}

.admin-hero p{
  max-width:860px;
  color:var(--muted);
  line-height:1.72;
  font-size:17px;
}

.admin-overview-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}

.admin-overview-card{
  border-radius:28px;
  padding:24px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.08);
}

.admin-overview-card span{
  display:block;
  color:var(--brown);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:950;
  margin-bottom:12px;
}

.admin-overview-card strong{
  display:block;
  font-size:40px;
  line-height:1;
  letter-spacing:-.05em;
  margin-bottom:8px;
}

.admin-overview-card small{
  display:block;
  color:var(--muted);
  line-height:1.55;
}

.admin-search-bar{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
}

.admin-search-input{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:60px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 12px 32px rgba(92,59,40,.06);
}

.admin-search-input span{
  color:var(--muted);
  font-size:18px;
}

.admin-search-input input{
  width:100%;
  border:0!important;
  background:transparent!important;
  padding:0!important;
  outline:none;
  color:var(--ink);
  font-size:16px;
}

.admin-user-stack,
.upgrade-request-stack,
.admin-plan-grid-v2{
  display:grid;
  gap:18px;
}

.admin-user-card,
.admin-form-card,
.admin-plan-card-v2,
.upgrade-request-card-v2{
  border-radius:34px;
  background:rgba(255,250,242,.84);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 20px 54px rgba(92,59,40,.09);
}

.admin-user-card{
  padding:26px;
  display:grid;
  grid-template-columns:1.15fr .95fr;
  gap:24px;
}

.admin-user-card-main{
  display:grid;
  gap:18px;
}

.admin-user-id{
  display:flex;
  gap:16px;
  align-items:flex-start;
}

.admin-user-avatar{
  width:62px;
  height:62px;
  border-radius:22px;
  display:grid;
  place-items:center;
  background:var(--green);
  color:#fffaf2;
  font-weight:950;
  font-size:24px;
  box-shadow:0 16px 32px rgba(23,60,52,.16);
  flex:0 0 auto;
}

.admin-user-id h2{
  font-size:28px;
  line-height:1.08;
  margin-bottom:4px;
}

.admin-user-id p{
  color:var(--muted);
  margin-bottom:10px;
}

.admin-user-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.admin-user-meta span,
.upgrade-request-facts div,
.upgrade-note-box,
.upgrade-history-box{
  border-radius:18px;
  background:rgba(92,59,40,.06);
  border:1px solid rgba(92,59,40,.08);
}

.admin-user-meta span{
  padding:10px 12px;
  color:var(--muted);
  font-size:13px;
}

.admin-usage-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
}

.admin-usage-grid > div{
  border-radius:22px;
  padding:16px;
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.10);
}

.admin-usage-grid b{
  display:block;
  font-size:24px;
  margin-bottom:6px;
}

.admin-usage-grid span{
  color:var(--muted);
  font-size:13px;
  line-height:1.4;
}

.admin-user-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.admin-user-editor,
.plan-create-grid,
.admin-plan-editor,
.upgrade-decision-form{
  display:grid;
  gap:14px;
}

.admin-user-editor{
  padding:22px;
  border-radius:28px;
  background:rgba(255,250,242,.7);
  border:1px solid rgba(92,59,40,.08);
  align-content:start;
}

.admin-user-editor label,
.plan-create-grid label,
.admin-form-grid label,
.admin-wide-field,
.upgrade-decision-form label{
  display:grid;
  gap:8px;
}

.admin-user-editor label span,
.plan-create-grid label span,
.admin-form-grid label span,
.admin-wide-field span,
.upgrade-decision-form label span{
  color:var(--brown);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:950;
}

.admin-user-editor select,
.admin-user-editor input,
.plan-create-grid input,
.admin-plan-editor input,
.admin-plan-editor textarea,
.admin-form-grid input,
.upgrade-decision-form textarea{
  width:100%;
  min-height:52px;
  border:1px solid rgba(92,59,40,.14)!important;
  background:#fffaf3!important;
  border-radius:18px;
  padding:14px 16px!important;
  outline:none;
  color:var(--ink);
  box-shadow:none!important;
}

.admin-plan-editor textarea,
.upgrade-decision-form textarea{
  min-height:120px;
  resize:vertical;
}

.admin-form-card{
  padding:26px;
}

.admin-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  margin-bottom:18px;
}

.admin-card-head h2{
  font-size:34px;
  line-height:1.08;
  margin-top:8px;
}

.admin-card-head p{
  max-width:520px;
  color:var(--muted);
  line-height:1.68;
}

.plan-create-grid{
  grid-template-columns:repeat(4,1fr);
}

.plan-span-2{
  grid-column:span 2;
}

.plan-feature-checks{
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  align-items:center;
}

.plan-feature-checks label,
.admin-switch{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(92,59,40,.06);
  border:1px solid rgba(92,59,40,.08);
  color:var(--muted);
  font-weight:850;
}

.admin-plan-grid-v2{
  grid-template-columns:1fr;
}

.admin-plan-card-v2{
  padding:24px;
}

.admin-plan-header-v2{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:flex-start;
  margin-bottom:18px;
}

.admin-plan-header-v2 span{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(23,60,52,.10);
  color:var(--green);
  font-size:12px;
  font-weight:950;
  margin-bottom:12px;
}

.admin-plan-header-v2 input{
  font-size:34px;
  font-weight:950;
  min-height:auto!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}

.admin-plan-header-v2 p{
  color:var(--muted);
  margin-top:6px;
  line-height:1.65;
}

.admin-plan-sections{
  display:grid;
  gap:18px;
}

.admin-plan-sections section{
  border-radius:26px;
  padding:20px;
  background:rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.08);
}

.admin-form-grid{
  display:grid;
  gap:12px;
}

.admin-form-grid.two-col{
  grid-template-columns:repeat(2,1fr);
}

.admin-form-grid.three-col{
  grid-template-columns:repeat(3,1fr);
}

.admin-wide-field textarea{
  width:100%;
  border:1px solid rgba(92,59,40,.14)!important;
  background:#fffaf3!important;
  border-radius:18px;
  padding:14px 16px!important;
}

.admin-plan-save{
  margin-top:8px;
}

.admin-filter-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.admin-filter-pills a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 16px;
  border-radius:999px;
  background:rgba(255,250,242,.78);
  border:1px solid rgba(92,59,40,.10);
  color:var(--muted);
  font-weight:900;
}

.admin-filter-pills a.active{
  background:var(--green);
  color:#fffaf2;
}

.upgrade-request-card-v2{
  padding:24px;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:22px;
}

.upgrade-request-main,
.upgrade-request-side{
  display:grid;
  gap:16px;
}

.upgrade-request-topline{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}

.upgrade-request-card-v2 h2{
  font-size:34px;
  line-height:1.08;
}

.upgrade-request-card-v2 h2 strong{
  color:var(--brown);
}

.upgrade-request-card-v2 p{
  color:var(--muted);
}

.upgrade-request-facts{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.upgrade-request-facts div{
  padding:16px;
}

.upgrade-request-facts span{
  display:block;
  color:var(--brown);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:950;
  margin-bottom:8px;
}

.upgrade-request-facts b{
  font-size:18px;
}

.upgrade-note-box,
.upgrade-history-box{
  padding:16px;
}

.upgrade-note-box span,
.upgrade-history-box span{
  display:block;
  color:var(--brown);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:950;
  margin-bottom:8px;
}

.upgrade-note-box p,
.upgrade-history-box p{
  color:var(--muted);
  line-height:1.7;
}

.upgrade-note-box.muted{
  background:rgba(23,60,52,.06);
}

.upgrade-request-side{
  border-radius:28px;
  padding:20px;
  background:rgba(255,250,242,.7);
  border:1px solid rgba(92,59,40,.08);
  align-content:start;
}

.upgrade-decision-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* remove old cramped tables/forms effect */
.admin-inline-form,
.admin-table-wrap,
.admin-plan-list,
.upgrade-request-list,
.admin-filter-tabs,
.admin-plan-grid,
.admin-check-grid,
.admin-plan-form{
  all:unset;
}

@media(max-width:1200px){
  .admin-overview-grid,
  .admin-usage-grid,
  .upgrade-request-facts{
    grid-template-columns:repeat(2,1fr);
  }

  .admin-user-card,
  .upgrade-request-card-v2,
  .admin-card-head{
    grid-template-columns:1fr;
  }

  .plan-create-grid,
  .admin-form-grid.three-col{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:760px){
  .admin-hero,
  .admin-card-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .admin-overview-grid,
  .admin-usage-grid,
  .upgrade-request-facts,
  .plan-create-grid,
  .admin-form-grid.two-col,
  .admin-form-grid.three-col,
  .admin-search-bar{
    grid-template-columns:1fr;
  }

  .admin-user-card{
    padding:20px;
  }

  .admin-user-id{
    flex-direction:column;
  }

  .plan-span-2{
    grid-column:span 1;
  }
}


/* =========================================================
   Pro navigation refresh - one-line desktop menu
   ========================================================= */
.nav{
  top:16px;
}

.nav .container.nav-inner{
  width:min(1240px,calc(100% - 40px));
}

.nav-inner{
  gap:22px!important;
  padding:12px 14px 12px 18px!important;
  border-radius:28px!important;
  min-height:72px;
}

.brand{
  flex:0 0 auto;
  min-width:max-content;
  white-space:nowrap;
}

.brand span:last-child{
  white-space:nowrap;
}

.nav-pro{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  flex:1 1 auto!important;
  min-width:0!important;
  white-space:nowrap!important;
}

.nav-primary,
.nav-actions{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.nav-actions{
  flex-shrink:0;
}

.nav-link-main,
.nav-drop-toggle,
.nav-account-toggle{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--muted);
  font:inherit;
  font-size:14px;
  font-weight:800;
  padding:0 12px;
  cursor:pointer;
  transition:.18s ease;
}

.nav-link-main:hover,
.nav-drop-toggle:hover,
.nav-account-toggle:hover{
  background:rgba(23,60,52,.07);
  color:var(--ink);
}

.nav-dropdown{
  position:relative;
  flex:0 0 auto;
}

.nav-drop-menu{
  position:absolute;
  top:calc(100% + 10px);
  left:0;
  width:280px;
  padding:10px;
  border-radius:22px;
  background:rgba(255,250,242,.98);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 24px 55px rgba(31,35,32,.16);
  display:none;
  z-index:100;
  backdrop-filter:blur(18px);
}

.nav-drop-menu-right{
  left:auto;
  right:0;
}

.nav-dropdown:hover .nav-drop-menu,
.nav-dropdown:focus-within .nav-drop-menu{
  display:grid;
  gap:4px;
}

.nav-drop-menu a{
  display:block;
  padding:12px 13px;
  border-radius:16px;
  color:var(--muted);
  white-space:normal;
}

.nav-drop-menu a:hover{
  background:rgba(23,60,52,.08);
  color:var(--ink);
}

.nav-drop-menu strong{
  display:block;
  font-size:14px;
  line-height:1.2;
  color:inherit;
}

.nav-drop-menu small{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
  font-weight:650;
}

.nav-cta-pro{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,var(--ink),#173c34)!important;
  color:#fffaf2!important;
  font-size:14px!important;
  font-weight:900!important;
  box-shadow:0 14px 32px rgba(31,35,32,.18)!important;
}

.nav-account-toggle{
  gap:8px;
  padding:4px 10px 4px 5px;
  border:1px solid rgba(92,59,40,.10);
  background:rgba(255,250,242,.62);
}

.nav-avatar{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#173c34,#0f766e);
  color:#fffaf2;
  font-size:13px;
  font-weight:950;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}

.nav-account-name{
  max-width:120px;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media(max-width:1120px){
  .nav-link-main,
  .nav-drop-toggle,
  .nav-account-toggle{
    padding-left:9px;
    padding-right:9px;
    font-size:13px;
  }

  .nav-primary{
    gap:4px;
  }

  .nav-account-name{
    display:none;
  }
}

@media(max-width:980px){
  .nav-inner{
    align-items:flex-start!important;
    border-radius:26px!important;
  }

  .nav-pro{
    display:none!important;
  }

  .nav-links{
    display:none!important;
  }

  .brand{
    font-size:20px;
  }

  .nav-inner::after{
    content:"Menu";
    min-height:42px;
    display:inline-flex;
    align-items:center;
    padding:0 14px;
    border-radius:999px;
    background:var(--ink);
    color:#fffaf2;
    font-weight:900;
    font-size:13px;
  }
}


/* =========================================================
   Real mobile menu fix - standout visual redesign
   ========================================================= */
.mobile-menu-toggle,
.mobile-menu-panel,
.mobile-menu-overlay{
  display:none;
}

@media(max-width:980px){
  .nav-inner{
    position:relative;
    align-items:center!important;
    border-radius:30px!important;
    z-index:120;
  }

  .nav-pro,
  .nav-links{
    display:none!important;
  }

  .nav-inner::after{
    display:none!important;
    content:none!important;
  }

  .mobile-menu-toggle{
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 20px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:999px;
    background:linear-gradient(135deg,#173c34,#0f766e);
    color:#fffaf2;
    font:inherit;
    font-weight:900;
    cursor:pointer;
    box-shadow:0 16px 34px rgba(23,60,52,.25);
    transition:.22s ease;
  }

  .mobile-menu-toggle.is-open{
    background:linear-gradient(135deg,#0f766e,#14b8a6);
    transform:translateY(-1px);
  }

  .mobile-menu-overlay{
    position:fixed;
    inset:0;
    background:rgba(16,24,24,.44);
    backdrop-filter:blur(4px);
    z-index:130;
  }

  .mobile-menu-overlay.is-open{
    display:block;
  }

  .mobile-menu-panel{
    position:absolute;
    left:14px;
    right:14px;
    top:calc(100% + 14px);
    padding:14px;
    border-radius:28px;
    background:linear-gradient(180deg,rgba(13,47,41,.98) 0%, rgba(22,69,60,.98) 100%);
    border:1px solid rgba(255,255,255,.10);
    box-shadow:0 28px 65px rgba(12,26,24,.30);
    z-index:140;
    backdrop-filter:blur(18px);
  }

  .mobile-menu-panel.is-open{
    display:grid;
    gap:10px;
  }

  .mobile-menu-panel a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:50px;
    padding:0 16px;
    border-radius:18px;
    color:#f8fafc;
    font-weight:850;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.05);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
    transition:.18s ease;
  }

  .mobile-menu-panel a:hover,
  .mobile-menu-panel a:focus,
  .mobile-menu-panel a:active{
    background:linear-gradient(135deg,#ecfeff,#dbeafe);
    color:#12352f;
    border-color:rgba(255,255,255,.30);
    box-shadow:0 12px 24px rgba(10,20,18,.14);
    transform:translateY(-1px);
  }

  .mobile-menu-panel a[href*="logout"]{
    background:rgba(255,245,240,.10);
    color:#ffe5d2;
  }

  .mobile-menu-panel a[href*="logout"]:hover,
  .mobile-menu-panel a[href*="logout"]:focus,
  .mobile-menu-panel a[href*="logout"]:active{
    background:linear-gradient(135deg,#fff1f2,#ffe4e6);
    color:#7f1d1d;
  }

  .brand span:last-child{
    white-space:normal;
    line-height:1.02;
  }
}

/* =========================================================
   Dashboard account redesign
   ========================================================= */
.dashboard-v2-section{
  padding-top:34px;
}

.dashboard-v2-hero{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:22px;
  margin-bottom:22px;
}

.dashboard-v2-hero-main,
.dashboard-v2-plan-card,
.dashboard-v2-nudge-card,
.dashboard-v2-stat-card,
.dashboard-v2-panel{
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 18px 48px rgba(92,59,40,.08);
}

.dashboard-v2-hero-main{
  border-radius:40px;
  padding:36px;
  background:
    radial-gradient(circle at 100% 0%, rgba(23,60,52,.10), transparent 28%),
    radial-gradient(circle at 0% 100%, rgba(198,146,73,.14), transparent 28%),
    rgba(255,250,242,.82);
}

.dashboard-v2-hero-main h1{
  font-size:clamp(40px,5vw,64px);
  line-height:1.01;
  letter-spacing:-.05em;
  margin:10px 0 14px;
}

.dashboard-v2-hero-main p{
  max-width:700px;
  color:var(--muted);
  line-height:1.8;
  font-size:17px;
}

.dashboard-v2-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:26px 0 18px;
}

.dashboard-v2-mini-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.dashboard-v2-mini-meta span{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(23,60,52,.08);
  color:var(--green);
  font-size:13px;
  font-weight:850;
}

.dashboard-v2-hero-side{
  display:grid;
  gap:22px;
}

.dashboard-v2-plan-card,
.dashboard-v2-nudge-card{
  border-radius:32px;
  padding:28px;
}

.dashboard-v2-plan-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}

.dashboard-v2-plan-top span,
.dashboard-v2-nudge-card span{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(23,60,52,.08);
  color:var(--green);
  font-weight:900;
  font-size:12px;
}

.dashboard-v2-plan-top a{
  color:var(--brown-dark);
  font-weight:850;
}

.dashboard-v2-plan-card strong{
  display:block;
  font-size:34px;
  line-height:1.05;
  margin-bottom:10px;
}

.dashboard-v2-plan-card p,
.dashboard-v2-nudge-card p,
.dashboard-v2-panel-head p,
.dashboard-v2-empty p,
.dashboard-v2-quick-links small,
.dashboard-v2-mini-row p{
  color:var(--muted);
  line-height:1.72;
}

.dashboard-v2-plan-progress{
  margin-top:18px;
  padding:16px 18px;
  border-radius:22px;
  background:rgba(92,59,40,.05);
}

.dashboard-v2-plan-progress b{
  display:block;
  font-size:26px;
  line-height:1;
  margin-bottom:6px;
}

.dashboard-v2-nudge-card h2{
  font-size:28px;
  line-height:1.12;
  margin:14px 0 10px;
}

.dashboard-v2-nudge-card .btn{
  margin-top:16px;
}

.dashboard-v2-stats{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:16px;
  margin-bottom:22px;
}

.dashboard-v2-stat-card{
  border-radius:28px;
  padding:22px;
  display:block;
}

.dashboard-v2-stat-card strong{
  display:block;
  font-size:42px;
  line-height:1;
  letter-spacing:-.04em;
}

.dashboard-v2-stat-card span{
  display:block;
  margin:10px 0 6px;
  font-size:18px;
  font-weight:900;
  color:var(--ink);
}

.dashboard-v2-stat-card small{
  display:block;
  color:var(--muted);
  line-height:1.55;
}

.dashboard-v2-main-grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(320px,.8fr);
  gap:22px;
  align-items:start;
}

.dashboard-v2-primary-column,
.dashboard-v2-side-column{
  display:grid;
  gap:22px;
}

.dashboard-v2-panel{
  border-radius:34px;
  padding:28px;
}

.dashboard-v2-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:18px;
}

.dashboard-v2-panel-head.compact h2,
.dashboard-v2-panel h2{
  font-size:40px;
  line-height:1.05;
}

.dashboard-v2-panel-head.compact h2{
  font-size:28px;
}

.dashboard-v2-empty{
  min-height:170px;
  border-radius:28px;
  padding:26px;
  background:rgba(92,59,40,.04);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.dashboard-v2-empty h3{
  font-size:26px;
  margin-bottom:8px;
}

.dashboard-v2-empty.soft{
  min-height:140px;
}

.dashboard-v2-empty.inline-empty{
  min-height:auto;
  padding:18px 20px;
  display:block;
}

.dashboard-v2-box-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}

.dashboard-v2-memory-card,
.dashboard-v2-daily-card{
  box-shadow:0 16px 38px rgba(92,59,40,.06);
}

.dashboard-v2-memory-card .memory-cover{
  min-height:220px;
}

.dashboard-v2-daily-grid{
  grid-template-columns:repeat(2,1fr);
}

.dashboard-v2-quick-links{
  display:grid;
  gap:12px;
}

.dashboard-v2-quick-links a{
  display:block;
  padding:18px 18px;
  border-radius:22px;
  background:rgba(92,59,40,.045);
  border:1px solid rgba(92,59,40,.10);
}

.dashboard-v2-quick-links strong{
  display:block;
  margin-bottom:6px;
  font-size:18px;
}

.dashboard-v2-list-rows{
  display:grid;
  gap:12px;
}

.dashboard-v2-mini-row{
  display:grid;
  grid-template-columns:116px 1fr;
  gap:14px;
  align-items:flex-start;
  padding:16px 0;
  border-bottom:1px solid rgba(92,59,40,.10);
}

.dashboard-v2-mini-row:last-child{
  border-bottom:0;
  padding-bottom:0;
}

.dashboard-v2-mini-row strong{
  font-size:15px;
  color:var(--green);
}

.dashboard-v2-mini-row b{
  display:block;
  font-size:18px;
  margin-bottom:5px;
}

@media(max-width:1200px){
  .dashboard-v2-stats{
    grid-template-columns:repeat(3,1fr);
  }

  .dashboard-v2-box-grid,
  .dashboard-v2-daily-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:980px){
  .dashboard-v2-hero,
  .dashboard-v2-main-grid{
    grid-template-columns:1fr;
  }

  .dashboard-v2-panel-head,
  .dashboard-v2-empty{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media(max-width:720px){
  .dashboard-v2-hero-main,
  .dashboard-v2-plan-card,
  .dashboard-v2-nudge-card,
  .dashboard-v2-panel{
    padding:22px;
    border-radius:28px;
  }

  .dashboard-v2-hero-main h1{
    font-size:42px;
  }

  .dashboard-v2-panel h2{
    font-size:32px;
  }

  .dashboard-v2-panel-head.compact h2,
  .dashboard-v2-empty h3{
    font-size:24px;
  }

  .dashboard-v2-stats{
    grid-template-columns:1fr 1fr;
  }

  .dashboard-v2-mini-row{
    grid-template-columns:1fr;
  }
}

@media(max-width:560px){
  .dashboard-v2-stats{
    grid-template-columns:1fr;
  }

  .dashboard-v2-actions,
  .dashboard-v2-mini-meta{
    display:grid;
    grid-template-columns:1fr;
  }
}

/* =========================================================
   Dashboard refinement - more spacing, hierarchy, personality
   ========================================================= */
.dashboard-v2-panel,
.dashboard-v2-hero-main,
.dashboard-v2-plan-card,
.dashboard-v2-nudge-card,
.dashboard-v2-stat-card{
  position:relative;
  overflow:hidden;
}

.dashboard-v2-panel:before,
.dashboard-v2-hero-main:before,
.dashboard-v2-plan-card:before,
.dashboard-v2-nudge-card:before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(23,60,52,.18), rgba(198,146,73,.18), transparent);
}

.dashboard-v2-panel{
  padding:34px;
}

.dashboard-v2-panel-head{
  align-items:flex-start;
  margin-bottom:24px;
}

.dashboard-v2-panel-head > div{
  max-width:560px;
}

.dashboard-v2-panel-head .section-kicker{
  margin-bottom:10px;
}

.dashboard-v2-panel-head h2{
  margin-bottom:10px;
  letter-spacing:-.04em;
}

.dashboard-v2-panel-head p{
  font-size:16px;
  max-width:540px;
}

.dashboard-v2-panel-head .btn,
.dashboard-v2-empty .btn{
  min-width:116px;
  min-height:52px;
  padding:0 22px;
  flex-shrink:0;
}

.dashboard-v2-empty{
  min-height:190px;
  padding:30px;
  border-radius:30px;
  background:linear-gradient(180deg, rgba(255,255,255,.46), rgba(92,59,40,.03));
}

.dashboard-v2-empty > div{
  max-width:530px;
}

.dashboard-v2-empty h3{
  margin-bottom:12px;
  letter-spacing:-.03em;
}

.dashboard-v2-empty p{
  font-size:18px;
  line-height:1.8;
}

.dashboard-v2-empty.inline-empty{
  padding:24px 22px;
  border-radius:22px;
}

.dashboard-v2-empty.inline-empty p{
  font-size:16px;
}

.dashboard-v2-box-grid,
.dashboard-v2-daily-grid{
  gap:20px;
}

.dashboard-v2-memory-card .memory-body,
.dashboard-v2-daily-card .today-entry-body{
  padding-top:18px;
}

.dashboard-v2-memory-card h2,
.dashboard-v2-daily-card p,
.dashboard-v2-mini-row b,
.dashboard-v2-tool-card strong{
  letter-spacing:-.02em;
}

.dashboard-v2-memory-card h2 a{
  line-height:1.15;
}

.dashboard-v2-memory-card p,
.dashboard-v2-daily-card p{
  margin-top:10px;
  line-height:1.8;
}

.dashboard-v2-memory-card .memory-meta,
.dashboard-v2-daily-card .memory-meta{
  gap:10px;
  margin-top:14px;
}

.dashboard-v2-memory-card .memory-meta span,
.dashboard-v2-daily-card .memory-meta span{
  padding:7px 10px;
  border-radius:999px;
  background:rgba(23,60,52,.05);
}

.dashboard-v2-memory-card .card-actions{
  margin-top:18px;
  gap:10px;
}

.dashboard-v2-quick-links{
  gap:14px;
}

.dashboard-v2-tool-card{
  display:grid!important;
  grid-template-columns:54px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:18px 18px!important;
  border-radius:24px!important;
  background:linear-gradient(180deg, rgba(255,255,255,.66), rgba(92,59,40,.03))!important;
}

.dashboard-v2-tool-card em{
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-style:normal;
  font-size:22px;
  color:var(--green);
  background:linear-gradient(135deg, rgba(23,60,52,.12), rgba(198,146,73,.12));
}

.dashboard-v2-tool-card strong{
  font-size:24px;
  margin-bottom:6px!important;
}

.dashboard-v2-tool-card small{
  font-size:14px;
  line-height:1.65;
}

.dashboard-v2-tool-card span{
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(23,60,52,.06);
  color:var(--green);
  font-weight:900;
  transition:.18s ease;
}

.dashboard-v2-tool-card:hover span{
  background:var(--green);
  color:#fff;
}

.dashboard-v2-list-panel .dashboard-v2-panel-head.compact{
  margin-bottom:20px;
}

.dashboard-v2-list-panel .dashboard-v2-panel-head.compact h2{
  font-size:34px;
}

.dashboard-v2-mini-row{
  grid-template-columns:128px 1fr;
  gap:18px;
  padding:18px 0;
}

.dashboard-v2-mini-row strong{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(23,60,52,.06);
  width:max-content;
}

.dashboard-v2-mini-row b{
  font-size:21px;
  margin-bottom:7px;
}

.dashboard-v2-mini-row p{
  font-size:15px;
  line-height:1.7;
}

.dashboard-v2-stat-card{
  padding:24px 22px;
  border-radius:30px;
  background:linear-gradient(180deg, rgba(255,255,255,.75), rgba(92,59,40,.03));
}

.dashboard-v2-stat-card strong{
  margin-bottom:8px;
}

.dashboard-v2-stat-card span{
  margin:0 0 8px;
  font-size:20px;
}

.dashboard-v2-stat-card small{
  font-size:14px;
  line-height:1.65;
}

@media(max-width:980px){
  .dashboard-v2-panel{
    padding:26px;
  }

  .dashboard-v2-tool-card strong{
    font-size:22px;
  }
}

@media(max-width:720px){
  .dashboard-v2-panel-head p,
  .dashboard-v2-empty p,
  .dashboard-v2-tool-card small{
    font-size:15px;
  }

  .dashboard-v2-tool-card{
    grid-template-columns:46px minmax(0,1fr) 30px;
    gap:12px;
    padding:16px!important;
  }

  .dashboard-v2-tool-card em{
    width:46px;
    height:46px;
    border-radius:14px;
    font-size:18px;
  }

  .dashboard-v2-tool-card strong,
  .dashboard-v2-list-panel .dashboard-v2-panel-head.compact h2{
    font-size:20px;
  }

  .dashboard-v2-mini-row b{
    font-size:18px;
  }
}


/* =========================================================
   Timeline image fit + in-page lightbox
   ========================================================= */
.timeline-entry__card.has-cover{
  grid-template-columns:minmax(240px, 0.82fr) minmax(0, 1.18fr);
  overflow:hidden;
}

.timeline-entry__cover{
  width:100%;
  height:100%;
  min-height:360px;
  display:block;
  border:0;
  border-radius:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  cursor:pointer;
  position:relative;
  overflow:hidden;
}

.timeline-entry__cover::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 54%, rgba(0,0,0,.42));
  opacity:.75;
  transition:.18s ease;
}

.timeline-entry__cover span{
  position:absolute;
  left:18px;
  bottom:18px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  min-height:42px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(255,250,242,.92);
  color:var(--brown-dark);
  font-weight:900;
  box-shadow:0 14px 28px rgba(31,35,32,.16);
}

.timeline-entry__cover:hover::before{
  opacity:1;
}

.timeline-entry__cover:hover span{
  transform:translateY(-2px);
}

/* Khi ảnh rất dọc/cao, vẫn không bị bóp méo. Cover sẽ crop nhẹ cho card đẹp.
   Bấm vào ảnh sẽ xem bản đầy đủ bằng object-fit: contain trong lightbox. */
.timeline-lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}

.timeline-lightbox.is-open{
  display:flex;
}

.timeline-lightbox__backdrop{
  position:absolute;
  inset:0;
  border:0;
  background:rgba(20,18,15,.72);
  backdrop-filter:blur(8px);
  cursor:pointer;
}

.timeline-lightbox__dialog{
  position:relative;
  z-index:2;
  width:min(1120px, 96vw);
  max-height:92vh;
  display:grid;
  gap:12px;
  justify-items:center;
}

.timeline-lightbox__image{
  max-width:100%;
  max-height:82vh;
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:24px;
  background:#111;
  box-shadow:0 30px 90px rgba(0,0,0,.42);
}

.timeline-lightbox__caption{
  color:#fffaf2;
  font-weight:900;
  text-align:center;
  text-shadow:0 2px 16px rgba(0,0,0,.32);
}

.timeline-lightbox__close{
  justify-self:end;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,250,242,.92);
  color:#1f2320;
  min-height:44px;
  padding:0 16px;
  border-radius:999px;
  font-weight:900;
  cursor:pointer;
}

.timeline-lightbox-open{
  overflow:hidden;
}

@media(max-width:980px){
  .timeline-entry__card.has-cover{
    grid-template-columns:1fr;
  }

  .timeline-entry__cover{
    min-height:320px;
    border-radius:28px 28px 0 0;
  }
}

@media(max-width:620px){
  .timeline-entry__cover{
    min-height:260px;
  }

  .timeline-lightbox{
    padding:14px;
  }

  .timeline-lightbox__image{
    max-height:78vh;
    border-radius:18px;
  }
}


/* =========================================================
   Timeline image final fit fix
   - full image visible in card
   - no old labels overlay
   - lightbox opens in page
   ========================================================= */
.timeline-entry__card.has-cover{
  grid-template-columns:minmax(260px, .82fr) minmax(0, 1.18fr)!important;
  overflow:hidden!important;
  align-items:stretch!important;
}

.timeline-entry__cover{
  width:100%!important;
  height:100%!important;
  min-height:360px!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:0!important;
  background:
    radial-gradient(circle at 50% 45%, rgba(255,250,242,.55), rgba(92,59,40,.08)),
    rgba(23,60,52,.06)!important;
  cursor:pointer!important;
  position:relative!important;
  overflow:hidden!important;
  padding:0!important;
}

.timeline-entry__cover::before,
.timeline-entry__cover::after{
  content:none!important;
  display:none!important;
}

.timeline-entry__cover span{
  display:none!important;
}

.timeline-entry__cover img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
  border:0!important;
  transition:transform .18s ease, filter .18s ease;
}

.timeline-entry__cover:hover img{
  transform:scale(1.015);
  filter:saturate(1.04);
}

.timeline-entry__cover:focus-visible{
  outline:4px solid rgba(23,60,52,.22)!important;
  outline-offset:-4px!important;
}

/* Make the card height balanced instead of letting portrait images dominate the row */
.timeline-entry__card.has-cover .timeline-entry__body{
  min-height:360px;
}

.timeline-lightbox{
  position:fixed!important;
  inset:0!important;
  z-index:9999!important;
  display:none;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
}

.timeline-lightbox.is-open{
  display:flex!important;
}

.timeline-lightbox__image{
  max-width:100%!important;
  max-height:82vh!important;
  width:auto!important;
  height:auto!important;
  object-fit:contain!important;
}

@media(max-width:980px){
  .timeline-entry__card.has-cover{
    grid-template-columns:1fr!important;
  }

  .timeline-entry__cover{
    min-height:320px!important;
    border-radius:28px 28px 0 0!important;
  }

  .timeline-entry__card.has-cover .timeline-entry__body{
    min-height:auto;
  }
}

@media(max-width:620px){
  .timeline-entry__cover{
    min-height:250px!important;
  }
}


/* =========================================================
   Full timeline inline mode inside timeline.php
   ========================================================= */

.full-timeline-page,
.full-timeline-page *{
  box-sizing:border-box;
}

.full-timeline-page{
  min-height:calc(100vh - 120px);
  padding:32px 0 70px;
  overflow:hidden;
}

.full-timeline-stage{
  position:relative;
  border-radius:42px;
  min-height:720px;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,250,242,.42), transparent 28%),
    radial-gradient(circle at 85% 18%, rgba(23,60,52,.16), transparent 32%),
    linear-gradient(135deg, rgba(255,250,242,.86), rgba(235,224,206,.74));
  border:1px solid rgba(92,59,40,.13);
  box-shadow:0 30px 90px rgba(92,59,40,.14);
  overflow:hidden;
}

.full-timeline-bg{
  position:absolute;
  inset:0;
  opacity:.42;
  background-image:
    linear-gradient(rgba(92,59,40,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(92,59,40,.045) 1px, transparent 1px);
  background-size:44px 44px;
  pointer-events:none;
}

.full-timeline-head{
  position:relative;
  z-index:4;
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:flex-start;
  padding:34px 38px 20px;
}

.full-timeline-head h1{
  font-size:clamp(44px,5vw,72px);
  line-height:.98;
  letter-spacing:-.06em;
  margin:8px 0 12px;
}

.full-timeline-head p{
  max-width:720px;
  color:var(--muted);
  line-height:1.75;
  font-size:17px;
}

.full-timeline-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}

.full-timeline-summary{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  padding:0 38px 24px;
}

.full-timeline-summary-card{
  padding:16px 18px;
  border-radius:22px;
  background:rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.10);
}

.full-timeline-summary-card span{
  display:block;
  color:var(--muted);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:900;
  margin-bottom:7px;
}

.full-timeline-summary-card strong{
  display:block;
  font-size:30px;
  color:var(--green);
}

.full-timeline-empty{
  position:relative;
  z-index:4;
  margin:30px 38px;
  border-radius:32px;
  padding:34px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.10);
}

.full-timeline-runner{
  position:relative;
  z-index:3;
  min-height:470px;
  margin:20px 0 0;
}

.full-timeline-line{
  position:absolute;
  left:0;
  right:0;
  top:235px;
  height:4px;
  background:linear-gradient(90deg, transparent, rgba(23,60,52,.28), transparent);
}

.full-timeline-track{
  position:absolute;
  left:0;
  top:0;
  height:100%;
  display:flex;
  align-items:center;
  gap:120px;
  padding:0 44vw;
  transition:transform 900ms cubic-bezier(.2,.8,.2,1);
  will-change:transform;
}

.full-moment{
  position:relative;
  flex:0 0 min(760px, 78vw);
  display:grid;
  grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr);
  min-height:390px;
  border-radius:36px;
  overflow:hidden;
  background:rgba(255,250,242,.92);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 28px 78px rgba(92,59,40,.14);
  transform:scale(.84);
  opacity:.42;
  filter:saturate(.72) blur(.2px);
  transition:transform 700ms ease, opacity 700ms ease, filter 700ms ease;
}

.full-moment.is-active{
  transform:scale(1);
  opacity:1;
  filter:saturate(1);
}

.full-moment::before{
  content:"";
  position:absolute;
  left:50%;
  top:calc(50% - 228px);
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 10px rgba(23,60,52,.10);
  transform:translateX(-50%);
  z-index:3;
}

.full-moment-media{
  background:
    radial-gradient(circle at center, rgba(255,250,242,.42), rgba(23,60,52,.08)),
    rgba(23,60,52,.05);
  display:grid;
  place-items:center;
  min-height:390px;
  overflow:hidden;
}

.full-moment-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
}

.full-moment-media.no-image{
  padding:28px;
  color:var(--green);
  font-size:44px;
  font-weight:950;
  text-align:center;
}

.full-moment-body{
  padding:36px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.full-moment-date{
  display:inline-flex;
  width:max-content;
  align-items:center;
  min-height:42px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(23,60,52,.09);
  color:var(--green);
  font-weight:950;
  margin-bottom:18px;
}

.full-moment-body h2{
  font-size:clamp(34px,4vw,56px);
  line-height:1.02;
  letter-spacing:-.055em;
  margin-bottom:14px;
}

.full-moment-body p{
  color:var(--muted);
  font-size:18px;
  line-height:1.75;
  margin-bottom:18px;
}

.full-moment-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.full-moment-meta span{
  display:inline-flex;
  min-height:38px;
  align-items:center;
  padding:0 13px;
  border-radius:999px;
  background:rgba(92,59,40,.07);
  color:var(--muted);
  font-weight:850;
  font-size:13px;
}

.full-timeline-controls{
  position:relative;
  z-index:4;
  display:grid;
  gap:14px;
  padding:18px 38px 34px;
}

.full-timeline-control-row{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}

.full-timeline-control-row button,
.full-timeline-control-row a{
  border:0;
  cursor:pointer;
}

.full-progress{
  height:10px;
  border-radius:999px;
  background:rgba(92,59,40,.10);
  overflow:hidden;
}

.full-progress-bar{
  width:0%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--green),#0f766e);
  transition:width 500ms ease;
}

.full-caption{
  text-align:center;
  color:var(--muted);
  font-weight:850;
}

.full-year-rail{
  position:absolute;
  left:38px;
  right:38px;
  bottom:26px;
  display:flex;
  justify-content:space-between;
  color:rgba(92,59,40,.34);
  font-size:13px;
  font-weight:950;
  pointer-events:none;
}

@media(max-width:980px){
  .full-timeline-stage{
    border-radius:32px;
  }

  .full-timeline-head,
  .full-timeline-summary,
  .full-timeline-controls{
    padding-left:22px;
    padding-right:22px;
  }

  .full-timeline-head{
    flex-direction:column;
  }

  .full-timeline-summary{
    grid-template-columns:1fr;
  }

  .full-timeline-track{
    padding:0 9vw;
    gap:60px;
  }

  .full-moment{
    grid-template-columns:1fr;
    flex-basis:82vw;
  }

  .full-moment-media{
    min-height:260px;
  }

  .full-moment-body{
    padding:26px;
  }

  .full-timeline-line{
    display:none;
  }

  .full-moment::before{
    display:none;
  }
}

@media(max-width:560px){
  .full-timeline-page{
    padding-top:22px;
  }

  .full-timeline-stage{
    min-height:720px;
  }

  .full-timeline-runner{
    min-height:500px;
  }

  .full-moment{
    flex-basis:86vw;
  }

  .full-moment-body h2{
    font-size:34px;
  }

  .full-moment-body p{
    font-size:16px;
  }
}


.full-timeline-inline{
  position:fixed;
  inset:0;
  z-index:9998;
  display:none;
}

.full-timeline-inline.is-open{
  display:block;
}

.full-timeline-inline__backdrop{
  position:absolute;
  inset:0;
  background:rgba(24,20,15,.72);
  backdrop-filter:blur(8px);
}

.full-timeline-inline__scroll{
  position:relative;
  z-index:2;
  height:100vh;
  overflow:auto;
  padding:26px;
}

.full-timeline-inline .full-timeline-page{
  padding:0;
  min-height:auto;
}

.full-timeline-inline .container{
  width:min(1280px,100%);
}

.full-timeline-inline .full-timeline-stage{
  min-height:calc(100vh - 52px);
}

.full-timeline-inline-open{
  overflow:hidden;
}

.full-timeline-inline .full-timeline-actions button{
  border:0;
  cursor:pointer;
}

.timeline-feed-head button[data-open-full-timeline],
.dash-actions button[data-open-full-timeline]{
  border:0;
  cursor:pointer;
}

@media(max-width:700px){
  .full-timeline-inline__scroll{
    padding:10px;
  }

  .full-timeline-inline .full-timeline-stage{
    min-height:calc(100vh - 20px);
    border-radius:28px;
  }
}


/* =========================================================
   Logged-in user home redesign - repaired
   ========================================================= */
.user-home{padding:34px 0 90px}.user-home-shell{display:grid;gap:24px}.user-home-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:22px;align-items:stretch}.user-home-hero-main,.user-home-focus-card,.user-stat-card,.user-panel{background:rgba(255,250,242,.84);border:1px solid rgba(92,59,40,.12);box-shadow:0 18px 48px rgba(92,59,40,.08)}.user-home-hero-main{border-radius:40px;padding:42px;background:radial-gradient(circle at 92% 12%, rgba(23,60,52,.12), transparent 26%),radial-gradient(circle at 8% 100%, rgba(198,146,73,.15), transparent 32%),rgba(255,250,242,.84)}.user-home-hero-main h1{font-size:clamp(42px,5vw,72px);line-height:.98;letter-spacing:-.06em;margin:10px 0 16px}.user-home-hero-main p{max-width:760px;color:var(--muted);font-size:18px;line-height:1.75}.user-home-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.user-home-focus-card{border-radius:34px;padding:30px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg, rgba(23,60,52,.12), rgba(255,250,242,.86)),rgba(255,250,242,.84)}.user-home-focus-card h2{font-size:34px;line-height:1.08;margin:18px 0 10px}.user-home-focus-card p{color:var(--muted);line-height:1.72;margin-bottom:22px}.user-home-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.user-stat-card{display:block;border-radius:28px;padding:24px}.user-stat-card strong{display:block;font-size:46px;line-height:1;color:var(--green);letter-spacing:-.04em}.user-stat-card span{display:block;margin:10px 0 6px;font-size:19px;font-weight:950;color:var(--ink)}.user-stat-card small{display:block;color:var(--muted);line-height:1.55}.user-home-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.75fr);gap:22px;align-items:start}.user-home-main-col,.user-home-side-col{display:grid;gap:22px}.user-panel{border-radius:34px;padding:28px}.user-panel-head{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:20px}.user-panel-head h2,.user-quick-panel h2{font-size:38px;line-height:1.05;letter-spacing:-.045em;margin-top:8px}.user-panel-head.compact h2{font-size:28px}.user-empty-state{border-radius:28px;padding:28px;background:rgba(92,59,40,.045)}.user-empty-state h3{font-size:26px;margin-bottom:8px}.user-empty-state p{color:var(--muted);line-height:1.7;margin-bottom:18px}.user-empty-state.compact{padding:20px}.user-empty-state.compact p{margin-bottom:12px}.user-box-list,.user-mini-timeline,.user-small-list,.user-quick-links{display:grid;gap:14px}.user-box-row{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center;padding:14px;border-radius:26px;background:rgba(92,59,40,.045);border:1px solid rgba(92,59,40,.08)}.user-box-thumb{height:120px;border-radius:20px;background-size:cover;background-position:center;background-color:rgba(23,60,52,.08)}.user-box-row strong,.user-timeline-row strong,.user-small-list strong,.user-quick-links b{display:block;color:var(--ink);font-size:20px;margin-bottom:6px}.user-box-row p,.user-timeline-row p{color:var(--muted);line-height:1.6;margin-bottom:8px}.user-box-row span,.user-small-list span,.user-quick-links span{color:var(--muted);font-size:13px;font-weight:750}.user-timeline-row{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:start;padding:16px 0;border-bottom:1px solid rgba(92,59,40,.10)}.user-timeline-row:last-child{border-bottom:0}.user-timeline-row time{width:max-content;padding:9px 12px;border-radius:999px;background:rgba(23,60,52,.08);color:var(--green);font-weight:900}.user-quick-links a,.user-small-list a{display:block;padding:18px;border-radius:22px;background:rgba(92,59,40,.045);border:1px solid rgba(92,59,40,.08)}.user-quick-links a:hover,.user-small-list a:hover,.user-box-row:hover,.user-timeline-row:hover{background:rgba(23,60,52,.07)}@media(max-width:1050px){.user-home-hero,.user-home-grid{grid-template-columns:1fr}.user-home-stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.user-home{padding-top:24px}.user-home-hero-main,.user-home-focus-card,.user-panel{padding:22px;border-radius:28px}.user-home-hero-main h1{font-size:42px}.user-home-stats{grid-template-columns:1fr}.user-panel-head{flex-direction:column;align-items:flex-start}.user-box-row,.user-timeline-row{grid-template-columns:1fr}.user-box-thumb{height:180px}}


/* =========================================================
   Vietnamese font final fix
   ========================================================= */
:root{
  --font-body:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  --font-display:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif!important;
}
html,body,body *,input,textarea,select,button{
  font-family:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5,h6,.section-title,.hero h1,.memory-v3-title,.user-home-hero-main h1{
  font-family:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  line-height:1.06!important;
  letter-spacing:-.045em!important;
}
h1 em,.hero h1 em{
  font-family:"Be Vietnam Pro",Arial,"Helvetica Neue",Helvetica,sans-serif!important;
  font-style:normal!important;
}


/* SePay checkout */
.sepay-checkout-card{max-width:860px;margin:0 auto}
.sepay-order-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}
.sepay-order-summary div{border-radius:20px;background:rgba(92,59,40,.06);padding:16px;border:1px solid rgba(92,59,40,.10)}
.sepay-order-summary span{display:block;font-size:12px;font-weight:950;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.sepay-order-summary strong{display:block;color:var(--ink);font-size:18px}
.sepay-checkout-box{border-radius:28px;border:1px solid rgba(92,59,40,.12);background:#fff;padding:18px;margin:18px 0;overflow:auto}
.sepay-help{color:var(--muted);line-height:1.7}
.error-note{border-color:rgba(150,48,36,.22);background:rgba(150,48,36,.06)}
.upgrade-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
@media(max-width:760px){.sepay-order-summary{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.sepay-order-summary{grid-template-columns:1fr}}


/* SePay inline QR/checkout frame */
.sepay-inline-wrap{
  margin:22px 0;
  border-radius:30px;
  border:1px solid rgba(92,59,40,.12);
  background:rgba(255,250,242,.72);
  padding:16px;
}

.sepay-inline-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
}

.sepay-inline-head b{
  display:block;
  font-size:20px;
  color:var(--ink);
  margin-bottom:4px;
}

.sepay-inline-head p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.sepay-inline-frame{
  width:100%;
  min-height:680px;
  border:1px solid rgba(92,59,40,.12);
  border-radius:24px;
  background:#fff;
  display:block;
}

#sepayCheckoutSource{
  display:none;
}

#sepayCheckoutSource.is-visible{
  display:block;
  margin-top:14px;
}

@media(max-width:760px){
  .sepay-inline-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .sepay-inline-frame{
    min-height:760px;
  }
}


/* Direct bank QR checkout */
.bank-qr-wrap{
  display:grid;
  grid-template-columns:320px 1fr;
  gap:22px;
  align-items:start;
  margin:22px 0;
}

.bank-qr-visual,
.bank-qr-info{
  border-radius:30px;
  border:1px solid rgba(92,59,40,.12);
  background:rgba(255,250,242,.74);
  padding:18px;
}

.bank-qr-visual img{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:contain;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(92,59,40,.1);
}

.bank-qr-visual p{
  margin:14px 0 0;
  font-size:14px;
  color:var(--muted);
}

.bank-qr-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:16px;
}

.bank-qr-facts div{
  border-radius:20px;
  background:#fff;
  border:1px solid rgba(92,59,40,.10);
  padding:14px;
}

.bank-qr-facts span{
  display:block;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  margin-bottom:8px;
}

.bank-qr-facts strong{
  display:block;
  font-size:18px;
  color:var(--ink);
  word-break:break-word;
}

.bank-qr-copy-grid{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:16px;
}

@media(max-width:760px){
  .bank-qr-wrap,
  .bank-qr-facts{
    grid-template-columns:1fr;
  }
}


/* Payment page - Direct bank QR redesign */
.direct-qr-checkout-card{
  max-width: 1120px;
  margin: 0 auto;
}

.bank-qr-layout{
  display:grid;
  grid-template-columns: minmax(340px, 420px) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  margin: 26px 0 22px;
}

.bank-qr-visual-card,
.bank-qr-info-card{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.bank-qr-visual-card,
.bank-transfer-sheet,
.bank-steps-card,
.payment-footer-note{
  border-radius: 30px;
  border: 1px solid rgba(92,59,40,.12);
  background: linear-gradient(180deg, rgba(255,250,242,.95), rgba(247,240,229,.92));
  box-shadow: 0 20px 50px rgba(44, 37, 28, 0.08);
}

.bank-qr-visual-card{
  padding: 20px;
  position: sticky;
  top: 110px;
}

.bank-qr-headline h3,
.bank-transfer-sheet h3{
  margin: 6px 0 8px;
  font-size: clamp(28px, 3vw, 36px);
  line-height: 1.05;
}

.bank-qr-headline p,
.payment-footer-note,
.bank-steps-list li{
  color: var(--muted);
  line-height: 1.7;
}

.bank-qr-chip,
.sheet-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: var(--brand-dark);
}

.bank-qr-chip{
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(23,60,52,.08);
  border: 1px solid rgba(23,60,52,.10);
}

.bank-qr-frame{
  padding: 18px;
  border-radius: 28px;
  background: #fff;
  border: 1px solid rgba(92,59,40,.10);
}

.bank-qr-frame img{
  display:block;
  width:100%;
  height:auto;
  border-radius: 18px;
  background:#fff;
}

.bank-qr-mini-note{
  padding: 14px 16px;
  border-radius: 20px;
  background: rgba(23,60,52,.06);
  border: 1px solid rgba(23,60,52,.10);
  font-size: 14px;
  color: var(--muted);
}

.bank-transfer-sheet,
.bank-steps-card,
.payment-footer-note{
  padding: 22px;
}

.bank-transfer-sheet__head{
  display:flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 18px;
}

.status-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:94px;
  padding:10px 16px;
  border-radius:999px;
  background: rgba(23,60,52,.10);
  color: var(--brand-dark);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.bank-transfer-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.bank-transfer-item{
  padding: 16px 18px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(92,59,40,.10);
}

.bank-transfer-item--wide{
  grid-column: 1 / -1;
}

.bank-transfer-item span{
  display:block;
  margin-bottom: 8px;
  font-size: 12px;
  color: var(--muted);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.bank-transfer-item strong{
  display:block;
  color: var(--ink);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.3;
  word-break: break-word;
}

.bank-qr-copy-grid{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top: 18px;
}

.bank-steps-list{
  margin: 12px 0 0;
  padding-left: 20px;
}

.bank-steps-list li + li{
  margin-top: 8px;
}

.payment-footer-note{
  margin-top: 6px;
}

@media (max-width: 980px){
  .bank-qr-layout{
    grid-template-columns: 1fr;
  }

  .bank-qr-visual-card{
    position: static;
  }
}

@media (max-width: 640px){
  .bank-transfer-sheet__head{
    flex-direction: column;
  }

  .bank-transfer-grid{
    grid-template-columns: 1fr;
  }

  .bank-transfer-item--wide{
    grid-column: auto;
  }

  .bank-qr-copy-grid .btn{
    width: 100%;
    justify-content: center;
  }
}

/* Pricing logic + prettier buttons */
.pricing-plan-card{
  position:relative;
}
.plan-top{
  position:relative;
}
.plan-state-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 0 12px;
  padding:8px 12px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.plan-state-badge.current{
  background:rgba(23,60,52,.1);
  color:var(--green);
}
.plan-state-badge.upgrade{
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
}
.plan-state-badge.downgrade{
  background:rgba(92,59,40,.08);
  color:var(--muted);
}
.pricing-plan-card.is-downgrade{
  opacity:.96;
}
.pricing-btn{
  width:100%;
  min-height:56px;
  padding:16px 20px;
  font-size:16px;
  font-weight:900;
  letter-spacing:-.02em;
  border-radius:20px;
  margin-top:auto;
}
.pricing-btn-upgrade,
.pricing-btn-register{
  background:linear-gradient(135deg, #17473d, #0f312b);
  color:#fffaf2;
  box-shadow:0 18px 32px rgba(23,60,52,.2);
}
.pricing-btn-upgrade:hover,
.pricing-btn-register:hover{
  transform:translateY(-2px);
  box-shadow:0 24px 38px rgba(23,60,52,.26);
}
.pricing-btn-downgrade{
  background:linear-gradient(180deg, rgba(255,250,242,.96), rgba(246,240,231,.92));
  color:var(--brown-dark);
  border:1px solid rgba(92,59,40,.14);
  box-shadow:0 14px 26px rgba(92,59,40,.08);
}
.pricing-btn-downgrade:hover{
  transform:translateY(-2px);
  border-color:rgba(92,59,40,.24);
  box-shadow:0 20px 32px rgba(92,59,40,.12);
}
.pricing-btn-current{
  background:rgba(255,250,242,.76);
  color:var(--brown-dark);
  border:1px solid rgba(92,59,40,.12);
  opacity:1;
}
.pricing-btn-current[disabled]{
  cursor:default;
}


/* =========================================================
   Navigation logical grouping refresh
   ========================================================= */
.nav-primary-logical{
  gap:6px;
}

.nav-primary-logical .nav-link-main,
.nav-primary-logical .nav-drop-toggle{
  padding-inline:14px;
}

.nav-drop-menu-wide{
  width:330px;
  padding:12px;
}

.nav-drop-menu-wide a,
.nav-account-menu a{
  position:relative;
  padding:14px 15px;
}

.nav-drop-highlight{
  background:linear-gradient(135deg, rgba(23,60,52,.10), rgba(198,146,73,.08));
  border:1px solid rgba(23,60,52,.08);
}

.nav-drop-highlight strong{
  color:var(--green)!important;
}

.nav-drop-menu a::after{
  content:"";
  position:absolute;
  inset:auto 14px 8px 14px;
  height:1px;
  background:rgba(92,59,40,.07);
  opacity:0;
}

.nav-drop-menu a:hover::after{
  opacity:1;
}

.nav-danger-link strong{
  color:#7b271e!important;
}

.nav-account-menu{
  width:300px;
}

.mobile-menu-group-label{
  padding:10px 14px 2px;
  color:rgba(255,250,242,.54);
  font-size:11px;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
}

@media(max-width:1180px){
  .nav-primary-logical .nav-link-main,
  .nav-primary-logical .nav-drop-toggle{
    padding-inline:10px;
    font-size:13px;
  }

  .nav .container.nav-inner{
    width:min(1280px,calc(100% - 24px));
  }
}


/* =========================================================
   Landing page redesign - guest homepage
   ========================================================= */
 .guest-hero{
  padding:56px 0 34px;
}
.guest-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(460px,1.12fr);
  gap:54px;
  align-items:center;
}
.guest-hero-copy{
  max-width:620px;
  padding-left:14px;
}
.guest-hero-copy h1{
  font-size:clamp(54px,6.4vw,88px);
  line-height:.95;
  letter-spacing:-.075em;
  margin:14px 0 18px;
}
.guest-hero-copy h1 em{
  color:var(--brown);
  font-style:normal;
}
.guest-hero-desc{
  max-width:610px;
  color:var(--muted);
  font-size:18px;
  line-height:1.8;
}
.guest-hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}
.guest-hero-points span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,250,242,.68);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 10px 28px rgba(61,45,30,.05);
  font-size:14px;
  font-weight:800;
  color:var(--brown-dark);
}
.guest-hero-points span::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--gold),#e1bc87);
}
.guest-hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:28px;
}
.guest-trust-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:26px;
}
.guest-trust-row div{
  padding:16px 18px;
  border-radius:22px;
  border:1px solid rgba(92,59,40,.1);
  background:rgba(255,250,242,.62);
  box-shadow:0 12px 35px rgba(61,45,30,.06);
}
.guest-trust-row strong{
  display:block;
  color:var(--green);
  font-size:24px;
  line-height:1;
  margin-bottom:6px;
}
.guest-trust-row span{
  color:var(--muted);
  font-weight:700;
  font-size:14px;
}
.guest-hero-visual{
  position:relative;
  min-height:620px;
}
.hero-memory-card.main{
  position:absolute;
  right:10px;
  top:16px;
  width:min(100%,560px);
  padding:20px;
  border-radius:40px;
  background:rgba(255,250,242,.94);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 28px 70px rgba(61,45,30,.13);
}
.hero-memory-photo{
  height:405px;
  border-radius:30px;
  background:url(hero-memory-meaningful.svg) center/cover no-repeat;
  box-shadow:inset 0 -80px 120px rgba(31,35,32,.10);
}
.hero-memory-meta{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:14px;
  margin-top:18px;
}
.hero-memory-meta h3{
  font-size:44px;
  letter-spacing:-.05em;
  margin-bottom:8px;
}
.hero-memory-meta p{
  color:var(--muted);
  line-height:1.55;
  max-width:360px;
}
.hero-float{
  position:absolute;
  max-width:245px;
  padding:20px;
  border-radius:24px;
  background:rgba(255,250,242,.95);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 22px 54px rgba(61,45,30,.12);
}
.hero-float-top{top:56px; right:-12px; transform:rotate(-3deg);}
.hero-float-bottom{left:6px; bottom:52px; transform:rotate(-2deg);}
.hero-float .label{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.hero-float strong{font-size:52px; line-height:1; color:var(--green);}
.hero-float p{margin-top:8px; line-height:1.6; color:var(--muted);}
@media(max-width:1024px){
  .guest-hero-grid{grid-template-columns:1fr;gap:30px;}
  .guest-hero-copy{max-width:none;padding-left:0;}
  .guest-hero-visual{min-height:540px;}
  .hero-memory-card.main{position:relative;right:auto;top:auto;margin:0 auto;}
  .hero-float-top{right:0;}
  .hero-float-bottom{left:0;bottom:18px;}
}
@media(max-width:720px){
  .guest-hero{padding:34px 0 18px;}
  .guest-hero-copy h1{font-size:clamp(42px,12vw,64px);}
  .guest-trust-row{grid-template-columns:1fr;}
  .guest-hero-visual{min-height:470px;}
  .hero-memory-photo{height:290px;}
  .hero-memory-meta{align-items:flex-start;flex-direction:column;}
  .hero-memory-meta h3{font-size:34px;}
  .hero-float{max-width:210px;padding:16px;}
  .hero-float-top{top:24px;right:0;}
  .hero-float-bottom{left:0;bottom:10px;}
}
.landing-strip{padding:14px 0 8px;}
.landing-strip-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.landing-strip-item{
  padding:18px 20px;
  border-radius:22px;
  background:rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.1);
}
.landing-strip-item strong{
  display:block;
  font-size:18px;
  letter-spacing:-.03em;
  margin-bottom:6px;
}
.landing-strip-item span{
  color:var(--muted);
  line-height:1.5;
  font-size:14px;
}

.landing-section,
.landing-workflow,
.landing-pricing-section,
.landing-testimonials,
.landing-faq,
.landing-final-cta{
  padding:86px 0 24px;
}
.landing-head.center{
  text-align:center;
  margin:0 auto 34px;
}
.landing-head.narrow{max-width:860px;}

.landing-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.landing-feature-card{
  border-radius:28px;
  padding:26px;
  background:rgba(255,250,242,.88);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 18px 48px rgba(61,45,30,.07);
}
.landing-feature-card.featured,
.landing-feature-card.accent{
  background:linear-gradient(180deg, rgba(255,250,242,.94), rgba(239,235,227,.94));
}
.landing-feature-card h3{
  font-size:32px;
  letter-spacing:-.045em;
  margin:18px 0 12px;
}
.landing-feature-card p{
  color:var(--muted);
  line-height:1.68;
}

.landing-workflow-grid{
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:22px;
  align-items:start;
}
.landing-steps{display:grid; gap:16px;}
.landing-step{
  display:grid;
  grid-template-columns:74px 1fr;
  gap:16px;
  padding:22px;
  border-radius:28px;
  background:rgba(255,250,242,.88);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 18px 48px rgba(61,45,30,.07);
}
.landing-step span{
  width:74px; height:74px; border-radius:24px; display:grid; place-items:center;
  background:linear-gradient(135deg, var(--green), #0f3f37); color:#fffaf2; font-size:22px; font-weight:900;
}
.landing-step h3{font-size:32px; letter-spacing:-.04em; margin:4px 0 8px;}
.landing-step p{color:var(--muted); line-height:1.65;}

.landing-pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.landing-price-card{
  position:relative;
  border-radius:30px;
  padding:28px;
  background:rgba(255,250,242,.88);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 18px 48px rgba(61,45,30,.07);
}
.landing-price-card.featured{
  background:linear-gradient(180deg, rgba(255,250,242,.98), rgba(244,240,233,.96));
  transform:translateY(-8px);
  box-shadow:0 28px 62px rgba(23,60,52,.12);
}
.landing-badge{
  position:absolute; top:18px; right:18px; padding:8px 12px; border-radius:999px; background:rgba(23,60,52,.08); color:var(--green); font-size:12px; font-weight:900;
}
.landing-plan-tag{
  display:inline-flex; padding:8px 12px; border-radius:999px; background:rgba(92,59,40,.06); font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);
}
.landing-price-card h3{font-size:34px; letter-spacing:-.045em; margin:14px 0 12px;}
.landing-price{font-size:42px; line-height:1; font-weight:900; letter-spacing:-.05em; color:var(--ink); margin-bottom:20px;}
.landing-price small{font-size:18px; color:var(--muted); font-weight:800;}
.landing-price-card ul{display:grid; gap:10px; margin:0 0 24px; padding:0; list-style:none;}
.landing-price-card li{padding-left:22px; position:relative; color:var(--muted); line-height:1.55;}
.landing-price-card li::before{content:'•'; position:absolute; left:6px; top:0; color:var(--green); font-weight:900;}

.testimonial-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.testimonial-card{
  border-radius:28px;
  padding:26px;
  background:rgba(255,250,242,.88);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 18px 48px rgba(61,45,30,.07);
}
.testimonial-card.featured{background:linear-gradient(135deg, rgba(23,60,52,.96), rgba(16,52,44,.94)); color:#fffaf2;}
.testimonial-card p{line-height:1.78; margin-bottom:18px; color:inherit;}
.testimonial-card strong{display:block; font-size:22px; letter-spacing:-.03em;}
.testimonial-card span{display:block; margin-top:4px; color:var(--muted); font-weight:700;}
.testimonial-card.featured span{color:rgba(255,250,242,.7);}

.landing-faq-grid{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:22px;
  align-items:start;
}
.faq-list{display:grid; gap:16px;}
.faq-list article{
  padding:22px 24px;
  border-radius:24px;
  background:rgba(255,250,242,.88);
  border:1px solid rgba(92,59,40,.1);
}
.faq-list h3{font-size:24px; letter-spacing:-.03em; margin-bottom:8px;}
.faq-list p{color:var(--muted); line-height:1.65;}

.landing-final-box{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:center;
  padding:34px;
  border-radius:36px;
  background:linear-gradient(135deg, var(--green), #0f3f37);
  color:#fffaf2;
  box-shadow:0 28px 62px rgba(23,60,52,.2);
}
.section-kicker.light,
.landing-final-box p{color:rgba(255,250,242,.76);}
.landing-final-box h2{font-size:clamp(34px,4vw,58px); line-height:.98; letter-spacing:-.05em; margin:10px 0 14px;}
.landing-final-box p{line-height:1.7; max-width:780px;}
.landing-final-actions{display:flex; gap:12px; flex-wrap:wrap;}
.btn.light{background:#fffaf2; color:var(--green); border-color:#fffaf2;}
.btn-ghost.light{background:transparent; color:#fffaf2; border-color:rgba(255,250,242,.28);}

.footer-compact{
  margin-top:52px;
  padding:0 0 36px;
}
.footer-compact-grid{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:22px 28px;
  border-radius:24px;
  background:rgba(255,250,242,.72);
  border:1px solid rgba(92,59,40,.1);
}
.footer-branding h3{
  font-size:22px;
  letter-spacing:-.04em;
  margin-bottom:6px;
}
.footer-branding p,
.copyright{
  color:var(--muted);
  font-size:14px;
}
.footer-links{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
}
.footer-links a{color:var(--muted); font-weight:800;}
.copyright{
  text-align:center;
  margin-top:12px;
}

@media(max-width:1100px){
  .guest-hero-grid,
  .landing-workflow-grid,
  .landing-faq-grid,
  .landing-final-box{
    grid-template-columns:1fr;
  }
  .landing-feature-grid,
  .landing-pricing-grid,
  .testimonial-grid,
  .landing-strip-grid{
    grid-template-columns:1fr 1fr;
  }
  .guest-hero-visual{min-height:520px;}
  .hero-float-top{right:0;}
}
@media(max-width:760px){
  .guest-hero{padding-top:28px;}
  .guest-hero-grid,
  .landing-feature-grid,
  .landing-pricing-grid,
  .testimonial-grid,
  .landing-strip-grid,
  .guest-trust-row{
    grid-template-columns:1fr;
  }
  .guest-hero-visual{min-height:440px;}
  .hero-memory-card.main{position:relative; top:auto; right:auto; width:100%;}
  .hero-memory-photo{height:260px;}
  .hero-float{max-width:200px;}
  .hero-float-top{top:10px; right:0;}
  .hero-float-bottom{left:0; bottom:6px;}
  .landing-final-actions,
  .footer-compact-grid{
    flex-direction:column;
    align-items:flex-start;
  }
  .landing-step{grid-template-columns:1fr;}
}


/* Memory box album: in-page lightbox */
.album-item{
  border:0;
  padding:0;
  cursor:zoom-in;
  overflow:hidden;
  background:transparent;
  display:block;
  width:100%;
  border-radius:inherit;
  font:inherit;
}

.album-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .28s ease, filter .28s ease;
}

.album-item:hover img{
  transform:scale(1.035);
  filter:saturate(1.04) contrast(1.02);
}

.memory-lightbox{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:28px;
  z-index:999;
}

.memory-lightbox.is-open{
  display:flex;
}

.memory-lightbox-backdrop{
  position:absolute;
  inset:0;
  background:rgba(18,22,20,.74);
  backdrop-filter:blur(10px);
}

.memory-lightbox-dialog{
  position:relative;
  width:min(1080px, calc(100vw - 44px));
  max-height:calc(100vh - 44px);
  border-radius:30px;
  background:rgba(255,250,242,.96);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 32px 90px rgba(0,0,0,.34);
  overflow:hidden;
  z-index:1;
}

.memory-lightbox-dialog img{
  width:100%;
  max-height:calc(100vh - 140px);
  object-fit:contain;
  background:#0f1412;
}

.memory-lightbox-close{
  position:absolute;
  top:14px;
  right:14px;
  width:44px;
  height:44px;
  border:0;
  border-radius:999px;
  background:rgba(255,250,242,.92);
  color:var(--ink);
  font-size:30px;
  line-height:1;
  font-weight:800;
  cursor:pointer;
  z-index:2;
  box-shadow:0 14px 32px rgba(0,0,0,.18);
}

.memory-lightbox-caption{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  padding:16px 20px;
  color:var(--ink);
}

.memory-lightbox-caption strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.memory-lightbox-caption span{
  color:var(--muted);
  font-weight:800;
  white-space:nowrap;
}

body.has-lightbox-open{
  overflow:hidden;
}

@media(max-width:720px){
  .memory-lightbox{
    padding:14px;
  }

  .memory-lightbox-dialog{
    width:calc(100vw - 20px);
    max-height:calc(100vh - 20px);
    border-radius:22px;
  }

  .memory-lightbox-dialog img{
    max-height:calc(100vh - 110px);
  }

  .memory-lightbox-caption{
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
  }
}


/* Today page image lightbox trigger */
.today-entry-image{
  border:0;
  display:block;
  width:100%;
  cursor:zoom-in;
  background-size:cover;
  background-position:center;
  transition:transform .25s ease, filter .25s ease;
}

.today-entry-image:hover{
  transform:scale(1.015);
  filter:saturate(1.04) contrast(1.02);
}


/* Upgrade payment live status */
.upgrade-live-status{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:18px 20px;
  margin-top:18px;
  border-radius:24px;
  border:1px solid rgba(92,59,40,.12);
  background:rgba(255,250,242,.82);
  box-shadow:0 16px 38px rgba(61,45,30,.07);
}

.upgrade-live-dot{
  width:14px;
  height:14px;
  border-radius:50%;
  margin-top:5px;
  background:var(--gold);
  box-shadow:0 0 0 7px rgba(198,146,73,.16);
  animation:upgradePulse 1.6s ease-in-out infinite;
}

.upgrade-live-status b{
  display:block;
  color:var(--ink);
  font-size:18px;
  margin-bottom:4px;
}

.upgrade-live-status p{
  color:var(--muted);
  line-height:1.6;
}

.upgrade-live-status.is-approved{
  border-color:rgba(23,60,52,.18);
  background:rgba(23,60,52,.08);
}

.upgrade-live-status.is-approved .upgrade-live-dot{
  background:var(--green);
  box-shadow:0 0 0 7px rgba(23,60,52,.14);
  animation:none;
}

.upgrade-live-status.is-rejected{
  border-color:rgba(150,48,36,.18);
  background:rgba(150,48,36,.08);
}

.upgrade-live-status.is-rejected .upgrade-live-dot{
  background:#963024;
  box-shadow:0 0 0 7px rgba(150,48,36,.13);
  animation:none;
}

.status-pill.is-approved{
  background:rgba(23,60,52,.1);
  color:var(--green);
}

.status-pill.is-rejected{
  background:rgba(150,48,36,.1);
  color:#7b271e;
}

.status-pill.is-pending{
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
}

@keyframes upgradePulse{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(.72);opacity:.62}
}


/* Semi-automatic payment confirmation */
.payment-confirm-card{
  margin-top:18px;
  padding:22px;
  border-radius:28px;
  border:1px solid rgba(23,60,52,.16);
  background:linear-gradient(180deg, rgba(255,250,242,.96), rgba(240,235,225,.94));
  box-shadow:0 18px 46px rgba(61,45,30,.08);
}

.payment-confirm-card h3{
  font-size:30px;
  line-height:1.05;
  letter-spacing:-.045em;
  margin:8px 0 8px;
}

.payment-confirm-card p{
  color:var(--muted);
  line-height:1.65;
}

.payment-confirm-fields{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(260px,.75fr);
  gap:14px;
  margin:18px 0;
}

.payment-confirm-fields label{
  display:grid;
  gap:8px;
  font-weight:850;
  color:var(--brown-dark);
}

.payment-confirm-fields textarea,
.payment-confirm-fields input[type=file]{
  width:100%;
  border-radius:18px;
  border:1px solid rgba(92,59,40,.14);
  background:rgba(255,255,255,.64);
  padding:13px 14px;
  color:var(--ink);
}

.payment-confirm-fields textarea{
  min-height:104px;
  resize:vertical;
}

.payment-proof-preview{
  display:inline-flex;
  margin:0 0 16px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(23,60,52,.08);
  color:var(--green);
  font-weight:900;
}

.upgrade-live-status.is-paid_reported{
  border-color:rgba(198,146,73,.24);
  background:rgba(198,146,73,.12);
}

.upgrade-live-status.is-paid_reported .upgrade-live-dot{
  background:var(--gold);
}

.status-pill.is-paid_reported{
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
}

.admin-overview-card.urgent{
  border-color:rgba(198,146,73,.28);
  background:linear-gradient(180deg, rgba(255,250,242,.96), rgba(248,234,206,.82));
}

.admin-badge.paid_reported{
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
}

.payment-reported-box{
  border-color:rgba(198,146,73,.24)!important;
  background:rgba(198,146,73,.08)!important;
}

.admin-proof-link{
  display:grid;
  grid-template-columns:86px 1fr;
  gap:12px;
  align-items:center;
  margin-top:12px;
  padding:10px;
  border-radius:18px;
  background:rgba(255,250,242,.76);
  border:1px solid rgba(92,59,40,.1);
}

.admin-proof-link img{
  width:86px;
  height:66px;
  border-radius:14px;
  object-fit:cover;
  background:#fff;
}

.admin-proof-link span{
  color:var(--green);
  font-weight:900;
}

@media(max-width:760px){
  .payment-confirm-fields{
    grid-template-columns:1fr;
  }
}


/* Memory page create - practical single-column redesign */
.memory-create-head{
  align-items:flex-end;
  margin-bottom:24px;
}

.memory-create-head h1{
  max-width:860px;
}

.memory-create-head p{
  max-width:820px;
}

.pages-builder-v2{
  display:block;
  max-width:980px;
  margin:0 auto;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}

.pages-create-form-v2{
  display:grid;
  gap:18px;
}

.page-create-progress{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding:10px;
  border-radius:999px;
  width:max-content;
  max-width:100%;
  background:rgba(255,250,242,.74);
  border:1px solid rgba(92,59,40,.1);
  box-shadow:0 14px 34px rgba(92,59,40,.06);
}

.page-create-progress span{
  padding:10px 14px;
  border-radius:999px;
  color:var(--muted);
  font-size:13px;
  font-weight:900;
}

.page-create-progress span.active{
  color:#fffaf2;
  background:var(--green);
}

.page-create-section{
  border-radius:34px;
  padding:28px;
  background:rgba(255,250,242,.82);
  border:1px solid rgba(92,59,40,.12);
  box-shadow:0 20px 54px rgba(92,59,40,.08);
}

.page-create-section-head{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:18px;
  align-items:start;
  margin-bottom:22px;
}

.page-create-section-head > span{
  display:inline-grid;
  place-items:center;
  min-height:42px;
  border-radius:999px;
  background:rgba(23,60,52,.1);
  color:var(--green);
  font-size:12px;
  font-weight:950;
}

.page-create-section-head h2{
  font-size:clamp(30px,3.2vw,44px);
  line-height:1.04;
  letter-spacing:-.05em;
  margin:0 0 8px;
}

.page-create-section-head p{
  color:var(--muted);
  line-height:1.65;
  max-width:720px;
}

.type-picker-v2{
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.type-picker-v2 label{
  position:relative;
  min-height:166px;
  padding:22px;
  border-radius:28px;
  transition:.22s ease;
}

.type-picker-v2 label:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 42px rgba(92,59,40,.09);
}

.type-picker-v2 input{
  position:absolute;
  top:18px;
  right:18px;
}

.type-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:17px;
  background:var(--green);
  color:#fffaf2;
  font-size:20px;
  font-weight:900;
  margin-bottom:16px;
}

.type-picker-v2 b{
  display:block;
  font-size:24px;
  letter-spacing:-.035em;
  margin-bottom:8px;
}

.type-picker-v2 small{
  font-size:14px;
  line-height:1.65;
}

.page-create-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.page-create-grid .field{
  min-width:0;
}

.page-create-grid .field small,
.page-create-grid-story .field small{
  color:var(--muted);
  line-height:1.55;
  font-weight:650;
}

.page-create-grid-story{
  grid-template-columns:1fr 1fr;
}

.page-create-grid-story textarea{
  min-height:170px;
}

.page-create-submit{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  padding:24px 28px;
  border-radius:34px;
  background:linear-gradient(135deg, var(--green), #0f3f37);
  color:#fffaf2;
  box-shadow:0 24px 56px rgba(23,60,52,.22);
}

.page-create-submit strong{
  display:block;
  font-size:24px;
  letter-spacing:-.035em;
  margin-bottom:6px;
}

.page-create-submit p{
  color:rgba(255,250,242,.72);
  line-height:1.6;
  max-width:620px;
}

.page-create-submit .btn-primary{
  background:#fffaf2;
  color:var(--green);
  box-shadow:0 14px 34px rgba(0,0,0,.12);
  white-space:nowrap;
}

@media(max-width:820px){
  .page-create-section-head,
  .page-create-grid,
  .page-create-grid-story,
  .type-picker-v2{
    grid-template-columns:1fr;
  }

  .page-create-section-head > span{
    width:max-content;
    min-height:auto;
    padding:9px 12px;
  }

  .page-create-submit{
    flex-direction:column;
    align-items:flex-start;
  }

  .page-create-submit .btn-primary{
    width:100%;
  }
}

@media(max-width:560px){
  .page-create-section{
    padding:22px;
    border-radius:28px;
  }

  .page-create-progress{
    width:100%;
    border-radius:24px;
  }

  .page-create-progress span{
    flex:1;
    text-align:center;
  }
}


/* Admin paid_reported hotfix */
.admin-badge.paid_reported,
.status-pill.is-paid_reported{
  background:rgba(198,146,73,.16);
  color:var(--brown-dark);
}

.payment-reported-box{
  border-color:rgba(198,146,73,.24)!important;
  background:rgba(198,146,73,.08)!important;
}

.upgrade-decision-form .btn-primary{
  min-width:140px;
}
