*{box-sizing:border-box;}
:root{--kyyeu-accent:#F0B75E; --kyyeu-heading-font:'Cormorant Garamond',serif; --kyyeu-heading-scale:1;}
html{background:#0D1526;}
body{margin:0; background:var(--kyyeu-bg,#0D1526); color:#EDE6DA; font-family:'Literata',serif; line-height:1.7; overflow-x:hidden;}
.wrap{max-width:720px; margin:0 auto; position:relative; z-index:2;}
@media (prefers-reduced-motion: reduce){ .sky-star, .lantern.released{animation:none !important;} }

.night-sky{
  position:fixed; inset:0; z-index:0; overflow:hidden;
  background:linear-gradient(180deg,#0A1020 0%,#131E33 60%,#1D2A44 100%);
}
.sky-star{position:absolute; background:#fff; border-radius:50%; opacity:.6; animation:twinkle 4s infinite alternate;}
@keyframes twinkle{0%{opacity:.25;} 100%{opacity:.9;}}

.cover{padding:56px 24px 24px; text-align:center; position:relative; z-index:2;}
.eyebrow{font-size:11.5px; letter-spacing:.25em; color:var(--kyyeu-accent); margin-bottom:16px;}
.cover-photo{width:160px; height:160px; border-radius:50%; margin:0 auto 18px; overflow:hidden; box-shadow:0 0 50px 8px rgba(240,183,94,.25); border:2px solid rgba(240,183,94,.45);}
.cover-photo img{width:100%; height:100%; object-fit:cover;}
.cover h1{font-family:var(--kyyeu-heading-font); font-style:italic; font-weight:600; font-size:calc(42px * var(--kyyeu-heading-scale)); margin:0 0 8px; color:var(--kyyeu-accent);}
.cover p{margin:0; font-size:14px; color:#A9B0C2;}

.section{padding:48px 24px 8px; position:relative; z-index:2;}
.section-head{text-align:center; margin-bottom:28px;}
.section h2{font-family:var(--kyyeu-heading-font); font-style:italic; font-weight:600; font-size:calc(28px * var(--kyyeu-heading-scale)); color:var(--kyyeu-accent); margin:0 0 4px;}
.section .sub{font-size:13px; color:#A9B0C2;}

/* ĐÈN LỒNG */
.lantern-field{display:flex; flex-wrap:wrap; justify-content:center; gap:22px; min-height:200px;}
.lantern{
  position:relative; width:120px; cursor:pointer;
  animation:sway 4s ease-in-out infinite; animation-delay:calc(var(--i) * .4s);
  transition:transform .3s ease;
}
@keyframes sway{0%,100%{transform:translateY(0) rotate(-1.5deg);} 50%{transform:translateY(-8px) rotate(1.5deg);}}
.lantern:hover{transform:scale(1.05);}
.lantern-body{
  background:linear-gradient(180deg,#F3C777,#E0913F);
  border-radius:14px 14px 22px 22px; padding:16px 12px 20px; text-align:center;
  box-shadow:0 0 28px 6px rgba(240,183,94,.35), inset 0 -8px 14px rgba(160,90,20,.25);
  border:1px solid rgba(255,220,160,.6);
}
.lantern-text{display:block; font-size:11.5px; color:#4A2A08; line-height:1.4;}
.lantern-name{display:block; margin-top:8px; font-family:'Cormorant Garamond',serif; font-style:italic; font-size:12.5px; color:#6B3B0C;}
.lantern-glow{position:absolute; inset:-14px; border-radius:50%; background:radial-gradient(circle, rgba(240,183,94,.28), transparent 70%); pointer-events:none;}
.lantern-tassel{width:2px; height:16px; background:rgba(240,183,94,.6); margin:0 auto;}

.lantern.released{
  animation:flyUp 6s cubic-bezier(.3,0,.6,1) forwards;
  pointer-events:none;
}
@keyframes flyUp{
  0%{transform:translateY(0) scale(1); opacity:1;}
  100%{transform:translateY(-90vh) translateX(calc(var(--drift, 0) * 1px)) scale(.35); opacity:.35;}
}
.lantern-hint{text-align:center; font-size:12px; color:#7C8598; font-style:italic; margin-top:22px;}

/* ẢNH */
.glow-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.glow-grid figure{margin:0; position:relative; border-radius:10px; overflow:hidden; box-shadow:0 0 22px 3px rgba(240,183,94,.14);}
.glow-grid img{width:100%; height:110px; object-fit:cover; display:block; filter:brightness(.95);}
.glow-grid figcaption{position:absolute; left:0; right:0; bottom:0; padding:6px 8px; font-size:11px; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.7));}
@media(min-width:600px){.glow-grid img{height:150px;}}

.see-full{text-align:center; margin:22px 0 0;}
.see-full a{font-family:var(--kyyeu-heading-font); font-style:italic; font-size:15px; color:var(--kyyeu-accent); text-decoration:none; border-bottom:1px solid rgba(240,183,94,.5);}

.share{margin:52px 24px 30px; padding:36px 24px; text-align:center; border-radius:16px; background:rgba(255,255,255,.05); border:1px solid rgba(240,183,94,.25); position:relative; z-index:2;}
.share h2{font-family:var(--kyyeu-heading-font); font-style:italic; font-size:26px; margin:0 0 6px; color:var(--kyyeu-accent);}
.share p{font-size:13px; margin:0 0 18px; color:#A9B0C2;}
#qrcode{background:#fff; display:inline-block; padding:8px; border-radius:8px; margin-bottom:14px;}
.link-row{display:flex; justify-content:center; gap:8px; flex-wrap:wrap; font-size:13px;}
.link-row code{background:rgba(240,183,94,.1); padding:6px 12px; border-radius:20px; color:var(--kyyeu-accent);}
.link-row button{background:var(--kyyeu-accent); color:#3A2408; border:none; padding:6px 14px; border-radius:20px; font-size:12.5px; font-weight:700; cursor:pointer;}

.foot{text-align:center; font-size:11.5px; color:#6B7285; padding:0 20px 40px; position:relative; z-index:2;}

/* BỘ ĐẾM ĐÈN */
.lantern-counter{text-align:center; font-size:13px; color:#A9B0C2; margin-bottom:20px;}
.lantern-counter strong{color:var(--kyyeu-accent); font-family:'Cormorant Garamond',serif; font-size:19px;}

/* ĐIỀU ƯỚC CHUNG */
.grand-wish{max-width:480px; margin:0 auto; text-align:center; position:relative; padding:34px 26px;
  background:rgba(240,183,94,.07); border:1px solid rgba(240,183,94,.3); border-radius:16px;}
.grand-lantern{width:54px; height:66px; margin:0 auto 18px; border-radius:12px 12px 20px 20px;
  background:linear-gradient(180deg,#F3C777,#E0913F); box-shadow:0 0 34px 10px rgba(240,183,94,.4);
  animation:sway 5s ease-in-out infinite;}
.grand-wish p{margin:0; font-family:'Cormorant Garamond',serif; font-style:italic; font-size:19px; color:#F5EEDF; line-height:1.6;}

/* LỜI CHÚC THẦY CÔ */
.teacher-wishes{max-width:520px; margin:0 auto;}
.teacher-wish{background:rgba(255,255,255,.05); border-left:3px solid var(--kyyeu-accent); border-radius:0 10px 10px 0; padding:16px 20px; margin-bottom:14px;}
.teacher-wish p{margin:0 0 8px; font-size:14.5px; color:#EDE6DA; font-style:italic;}
.teacher-wish cite{font-family:'Cormorant Garamond',serif; font-style:normal; font-size:13px; color:var(--kyyeu-accent);}
