:root {
  --cream: #fdf6ee; --beige: #f5e6d3; --soft-pink: #f2c4c4;
  --warm-brown: #8b5e3c; --gold: #d4a853; --gold-glow: #f0c96e;
  --dark-warm: #3d2b1f; --text-dark: #4a3728;
}
* { margin:0; padding:0; box-sizing:border-box; }
html,body { width:100%; height:100%; overflow:hidden; background:var(--cream); font-family:'Lato',sans-serif; }

.screen {
  position:fixed; inset:0;
  display:flex; align-items:center; justify-content:center; flex-direction:column;
  opacity:0; pointer-events:none;
  transition:opacity 0.8s ease; z-index:10;
}
.screen.active { opacity:1; pointer-events:all; }
.screen.scrollable { align-items:flex-start; overflow-y:auto; overflow-x:hidden; padding:40px 20px 60px; }

/* Sparkles */
.sparkle { position:fixed; pointer-events:none; z-index:5; font-size:14px; animation:floatSparkle linear infinite; opacity:0; }
@keyframes floatSparkle {
  0%{opacity:0;transform:translateY(0) rotate(0deg)}
  10%{opacity:0.8} 90%{opacity:0.4}
  100%{opacity:0;transform:translateY(-100vh) rotate(360deg)}
}

/* Loading */
#loading { background:linear-gradient(135deg,#f5e6d3,#fdf0e0,#f9ddd5); }
.load-text { font-family:'Dancing Script',cursive; font-size:clamp(1.4rem,5vw,2rem); color:var(--warm-brown); text-align:center; animation:breathe 2s ease-in-out infinite; z-index:2; padding:0 24px; }
.load-bar { width:200px; height:2px; background:rgba(139,94,60,0.2); border-radius:2px; margin-top:24px; overflow:hidden; z-index:2; }
.load-fill { height:100%; width:0%; background:linear-gradient(90deg,var(--warm-brown),var(--gold)); border-radius:2px; transition:width 2.5s ease; }
@keyframes breathe { 0%,100%{opacity:0.7} 50%{opacity:1} }

/* Password */
#password { background:linear-gradient(160deg,#fdf6ee,#f5e6d3,#fce8e8); }

.pw-card {
  background:rgba(253,246,238,0.96);
  border:1px solid rgba(212,168,83,0.32);
  border-radius:24px;
  padding:28px 24px 24px;
  width:min(360px,92vw);
  box-shadow:0 8px 40px rgba(139,94,60,0.13), 0 1px 0 rgba(255,255,255,0.8) inset;
  text-align:center;
  position:relative;
}
.pw-input {
  width:100%;
  padding:12px 18px;
  border-radius:12px;
  border:1px solid rgba(139,94,60,0.2);
  background:rgba(255,255,255,0.6);
  color:var(--dark-warm);
  font-family:'Lato',sans-serif;
  font-size:16px; /* Prevents iOS/mobile auto-zoom on focus */
  text-align:center;
  margin-bottom:14px;
  outline:none;
  transition:all 0.3s ease;
}
.pw-input:focus {
  border-color:var(--gold);
  background:rgba(255,255,255,0.9);
  box-shadow:0 0 0 3px rgba(212,168,83,0.2);
}
.pw-input.error {
  border-color:#c05555;
  background:rgba(255,240,240,0.8);
  box-shadow:0 0 0 3px rgba(192,85,85,0.25);
  color:#b04444;
}
.pw-input.shake {
  animation:inputShake 0.45s ease;
}
@keyframes inputShake {
  0%,100%{transform:translateX(0)}
  15%{transform:translateX(-8px)}
  30%{transform:translateX(8px)}
  45%{transform:translateX(-6px)}
  60%{transform:translateX(6px)}
  75%{transform:translateX(-3px)}
  90%{transform:translateX(3px)}
}
.lock-icon { font-size:2.2rem; margin-bottom:10px; display:block; transition:transform 0.4s cubic-bezier(0.34,1.56,0.64,1); }
.lock-icon.unlocked { transform:rotate(-20deg) scale(1.2); }
.pw-title { font-family:'Cormorant Garamond',serif; font-size:clamp(1rem,4vw,1.35rem); color:var(--dark-warm); font-style:italic; margin-bottom:4px; line-height:1.4; }
.pw-sub { font-size:0.72rem; color:var(--warm-brown); opacity:0.55; margin-bottom:20px; letter-spacing:0.08em; }

/* Dot display */
.pw-dots-row {
  display:flex; justify-content:center; gap:12px;
  margin-bottom:6px;
}
.pw-dot {
  width:14px; height:14px;
  border-radius:50%;
  border:2px solid rgba(139,94,60,0.3);
  background:transparent;
  transition:all 0.2s cubic-bezier(0.34,1.56,0.64,1);
  position:relative;
}
.pw-dot.filled {
  background:var(--warm-brown);
  border-color:var(--warm-brown);
  transform:scale(1.15);
  box-shadow:0 0 8px rgba(139,94,60,0.3);
}
.pw-dot.error {
  background:#c05555;
  border-color:#c05555;
  box-shadow:0 0 8px rgba(192,85,85,0.4);
}
.pw-dot.success {
  background:var(--gold);
  border-color:var(--gold);
  box-shadow:0 0 10px rgba(212,168,83,0.5);
}
.pw-dots-wrap {
  border:1.5px solid rgba(212,168,83,0.25);
  border-radius:50px;
  padding:12px 24px;
  background:rgba(255,255,255,0.5);
  display:inline-flex;
  margin-bottom:4px;
  transition:all 0.3s ease;
}
.pw-dots-wrap.shake { animation:dotShake 0.45s ease; }
@keyframes dotShake {
  0%,100%{transform:translateX(0)}
  15%{transform:translateX(-9px)}
  30%{transform:translateX(9px)}
  45%{transform:translateX(-6px)}
  60%{transform:translateX(6px)}
  75%{transform:translateX(-3px)}
  90%{transform:translateX(3px)}
}

.pw-msg {
  font-family:'Cormorant Garamond',serif;
  font-size:0.95rem; color:#b04444; font-style:italic;
  min-height:20px; margin-bottom:14px;
  opacity:0;
  transform:translateY(-6px);
  transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.pw-msg.visible {
  opacity:1;
  transform:translateY(0);
}

/* Keypad grid */
.keypad {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:12px;
}
.key-btn {
  aspect-ratio:1;
  border:1.5px solid rgba(212,168,83,0.25);
  border-radius:16px;
  background:rgba(255,255,255,0.6);
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.2rem,5vw,1.5rem);
  color:var(--dark-warm);
  cursor:pointer;
  transition:all 0.15s ease;
  box-shadow:0 2px 8px rgba(139,94,60,0.06), 0 1px 0 rgba(255,255,255,0.9) inset;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.key-btn:active, .key-btn.pressing {
  transform:scale(0.93);
  background:rgba(212,168,83,0.18);
  border-color:rgba(212,168,83,0.5);
  box-shadow:0 1px 4px rgba(139,94,60,0.1);
}
.key-btn::after {
  content:'';
  position:absolute; inset:0; border-radius:14px;
  background:radial-gradient(circle at center,rgba(212,168,83,0.3) 0%,transparent 70%);
  opacity:0; transition:opacity 0.3s ease;
  pointer-events:none;
}
.key-btn.pressing::after { opacity:1; }

/* Zero row */
.keypad-bottom {
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:10px;
  margin-bottom:12px;
}
.key-zero { grid-column:2; }
.key-del {
  aspect-ratio:1; border:1.5px solid rgba(212,168,83,0.2); border-radius:16px;
  background:rgba(255,240,240,0.5); font-size:1.2rem; color:#b04444;
  cursor:pointer; transition:all 0.15s ease; display:flex; align-items:center;
  justify-content:center; user-select:none; -webkit-tap-highlight-color:transparent;
  box-shadow:0 2px 8px rgba(139,94,60,0.06);
}
.key-del:active, .key-del.pressing { transform:scale(0.93); background:rgba(192,85,85,0.12); border-color:rgba(192,85,85,0.35); }

/* Unlock btn */
.pw-btn {
  width:100%; padding:13px; border:none; border-radius:50px;
  background:linear-gradient(135deg,var(--warm-brown),#6b3f20);
  color:var(--cream); font-family:'Dancing Script',cursive; font-size:1.15rem;
  cursor:pointer; transition:all 0.3s ease;
  box-shadow:0 4px 16px rgba(139,94,60,0.25);
  margin-bottom:10px;
}
.pw-btn:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 6px 22px rgba(139,94,60,0.35); }
.pw-btn:disabled { opacity:0.45; cursor:not-allowed; transform:none; box-shadow:none; }

/* Hint btn */
.hint-btn {
  background:none; border:none; font-size:0.78rem; color:var(--warm-brown);
  opacity:0.55; cursor:pointer; text-decoration:underline dotted;
  transition:opacity 0.3s; font-family:'Lato',sans-serif; letter-spacing:0.04em;
}
.hint-btn:hover { opacity:1; }

/* Hint overlay + popup */
.hint-overlay {
  position:fixed; inset:0; z-index:98;
  background:rgba(61,43,31,0.35);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  opacity:0; pointer-events:none;
  transition:opacity 0.35s ease;
}
.hint-overlay.show { opacity:1; pointer-events:all; }

.hint-popup {
  position:fixed; top:50%; left:50%;
  transform:translate(-50%,-50%) scale(0.88) rotate(-1deg);
  z-index:100; opacity:0; pointer-events:none;
  transition:all 0.35s cubic-bezier(0.34,1.56,0.64,1);
  width:min(300px,82vw);
}
.hint-popup.show { opacity:1; transform:translate(-50%,-50%) scale(1) rotate(-1deg); pointer-events:all; }
.hint-paper {
  background:#fefae8;
  border:1px solid rgba(212,168,83,0.45);
  border-radius:14px 14px 14px 4px;
  padding:22px 24px 18px;
  box-shadow:
    0 8px 30px rgba(139,94,60,0.18),
    0 0 0 3px rgba(212,168,83,0.08),
    2px 2px 0 rgba(212,168,83,0.15);
  position:relative;
  text-align:center;
}
.hint-paper::before {
  content:'';
  position:absolute; top:0; left:0; right:0; bottom:0;
  border-radius:14px 14px 14px 4px;
  background:repeating-linear-gradient(
    0deg, transparent, transparent 27px,
    rgba(212,168,83,0.08) 27px, rgba(212,168,83,0.08) 28px
  );
  pointer-events:none;
}
.hint-pin {
  position:absolute; top:-10px; left:50%; transform:translateX(-50%);
  width:18px; height:18px; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #f0c96e, #c8922a);
  box-shadow:0 2px 6px rgba(139,94,60,0.4);
  border:1px solid rgba(212,168,83,0.6);
}
.hint-emoji { font-size:1.6rem; margin-bottom:8px; display:block; }
.hint-text {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  color:var(--dark-warm); font-size:1rem; line-height:1.5;
  position:relative; z-index:1;
}

/* Welcome */
#welcome { background:linear-gradient(160deg,#fdf6ee,#f5e6d3,#fce8e8); }
.welcome-text { font-family:'Dancing Script',cursive; font-size:clamp(1.8rem,7vw,3rem); color:var(--warm-brown); text-align:center; text-shadow:0 2px 20px rgba(212,168,83,0.3); padding:0 24px; animation:fadeInUp 1.2s ease; }
@keyframes fadeInUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }

/* Typewriter */
#typewriter-screen { background:linear-gradient(160deg,#fdf6ee,#f5e6d3); }
.tw-text { font-family:'Cormorant Garamond',serif; font-size:clamp(1.3rem,5vw,2rem); font-style:italic; color:var(--text-dark); text-align:center; padding:0 24px; }
.cursor { animation:blink 0.7s step-end infinite; }
@keyframes blink { 50%{opacity:0} }

/* Memory Hub */
#memory-hub { background:linear-gradient(160deg,#fdf6ee,#f5e6d3,#fce8e8); }
.hub-inner { width:100%; max-width:700px; margin:0 auto; }
.hub-title { font-family:'Dancing Script',cursive; font-size:clamp(1.5rem,6vw,2.4rem); color:var(--warm-brown); text-align:center; margin-bottom:8px; }
.hub-sub { font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--warm-brown); opacity:0.6; text-align:center; font-size:0.95rem; margin-bottom:32px; }
.memory-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(170px,40vw),1fr)); gap:14px; }
.memory-card { background:rgba(253,246,238,0.9); border:1px solid rgba(212,168,83,0.25); border-radius:16px; padding:20px 14px; text-align:center; cursor:pointer; transition:all 0.35s ease; box-shadow:0 4px 16px rgba(139,94,60,0.08); }
.memory-card:hover { transform:translateY(-4px) rotate(-0.5deg); box-shadow:0 10px 30px rgba(139,94,60,0.15); }
.memory-emoji { font-size:2rem; display:block; margin-bottom:8px; }
.memory-label { font-family:'Dancing Script',cursive; font-size:1rem; color:var(--dark-warm); line-height:1.3; }

/* Detail screens */
.back-btn { background:none; border:1px solid rgba(139,94,60,0.3); border-radius:50px; padding:8px 20px; font-size:0.8rem; color:var(--warm-brown); cursor:pointer; transition:all 0.3s; margin-bottom:24px; letter-spacing:0.06em; }
.back-btn:hover { background:rgba(139,94,60,0.08); }
.detail-title { font-family:'Dancing Script',cursive; font-size:clamp(1.8rem,7vw,2.8rem); color:var(--warm-brown); margin-bottom:8px; text-align:center; }
.detail-intro { font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--text-dark); opacity:0.8; text-align:center; font-size:1rem; margin-bottom:28px; line-height:1.7; }
.polaroid { background:white; padding:14px 14px 40px; box-shadow:0 4px 20px rgba(0,0,0,0.1); border-radius:4px; margin:12px auto; max-width:280px; text-align:center; transform:rotate(-1.5deg); transition:transform 0.3s ease; }
.polaroid:hover { transform:rotate(0deg) scale(1.02); }
.polaroid:nth-child(even) { transform:rotate(1deg); }
.polaroid-img { width:100%; aspect-ratio:1; background:linear-gradient(135deg,#f5e6d3,#fce8e8); display:flex; align-items:center; justify-content:center; font-size:3rem; border-radius:2px; }
.polaroid-caption { font-family:'Dancing Script',cursive; font-size:0.95rem; color:var(--dark-warm); margin-top:10px; }
.memory-note { background:rgba(255,255,255,0.7); border-left:3px solid var(--gold); padding:16px 20px; border-radius:0 12px 12px 0; margin:12px 0; font-family:'Cormorant Garamond',serif; font-size:1rem; color:var(--text-dark); font-style:italic; line-height:1.7; }
.tag-row { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.tag { background:rgba(212,168,83,0.12); border:1px solid rgba(212,168,83,0.3); border-radius:50px; padding:4px 14px; font-size:0.75rem; color:var(--warm-brown); letter-spacing:0.04em; }
.chaos-card { background:rgba(255,255,255,0.75); border:1px dashed rgba(212,168,83,0.4); border-radius:12px; padding:14px 18px; margin:10px 0; font-family:'Cormorant Garamond',serif; font-size:1rem; color:var(--text-dark); line-height:1.6; position:relative; }
.chaos-badge { position:absolute; top:-8px; right:12px; font-size:0.7rem; background:var(--soft-pink); border-radius:50px; padding:2px 10px; color:var(--dark-warm); letter-spacing:0.04em; }

/* Late night */
#late-night { background:linear-gradient(160deg,#1e1510,#2a1f17,#1a1208); }
#late-night .detail-title { color:var(--gold-glow); }
#late-night .detail-intro { color:rgba(253,246,238,0.7); }
#late-night .memory-note { background:rgba(255,255,255,0.05); border-left-color:var(--gold); color:rgba(253,246,238,0.8); }
#late-night .back-btn { color:var(--gold-glow); border-color:rgba(212,168,83,0.4); }

/* Little things */
#little-things { background:linear-gradient(160deg,#fdf6ee,#f5e6d3); }
.things-inner { max-width:600px; margin:0 auto; width:100%; }
.memory-bubble { background:rgba(255,255,255,0.8); border:1px solid rgba(212,168,83,0.2); border-radius:18px 18px 18px 4px; padding:14px 20px; margin:10px 0; font-family:'Cormorant Garamond',serif; font-size:1rem; color:var(--text-dark); font-style:italic; max-width:85%; line-height:1.6; animation:bubbleIn 0.5s ease backwards; }
.memory-bubble:nth-child(even) { margin-left:auto; border-radius:18px 18px 4px 18px; text-align:right; }
@keyframes bubbleIn { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

/* Puzzle */
#puzzle-screen { background:linear-gradient(160deg,#fdf6ee,#ede0d4); }
.puzzle-inner { max-width:500px; margin:0 auto; width:100%; }
.puzzle-pre { font-family:'Dancing Script',cursive; font-size:clamp(1.3rem,5vw,1.8rem); color:var(--warm-brown); text-align:center; margin-bottom:20px; }
.puzzle-preview { width:80px; height:80px; border-radius:8px; overflow:hidden; margin:0 auto 20px; opacity:0.35; filter:blur(4px); transition:all 0.8s ease; border:2px solid rgba(212,168,83,0.3); }
.puzzle-preview img { width:100%; height:100%; object-fit:cover; }
.puzzle-preview.revealed { opacity:1; filter:blur(0); }
.puzzle-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:3px; width:min(320px,88vw); margin:0 auto; background:rgba(139,94,60,0.2); border-radius:8px; padding:3px; box-shadow:0 8px 30px rgba(139,94,60,0.15); position:relative; touch-action:none; user-select:none; }
.puzzle-piece { aspect-ratio:1; background-size:300% 300%; border-radius:4px; cursor:grab; transition:box-shadow 0.15s ease; user-select:none; touch-action:none; -webkit-user-select:none; position:relative; }
.puzzle-piece.dragging { cursor:grabbing; opacity:0; }
.puzzle-piece.drag-over { box-shadow:0 0 0 3px var(--gold), 0 4px 15px rgba(212,168,83,0.4); }
.puzzle-piece.snap-in { animation:snapIn 0.28s cubic-bezier(0.34,1.56,0.64,1); }
@keyframes snapIn { 0%{transform:scale(1.08)} 60%{transform:scale(0.97)} 100%{transform:scale(1)} }
/* Drag ghost */
#drag-ghost { position:fixed; pointer-events:none; z-index:999; border-radius:6px; box-shadow:0 8px 24px rgba(139,94,60,0.3), 0 0 0 2px rgba(212,168,83,0.5); transform:translate(-50%,-50%) scale(1.08); opacity:0.92; transition:none; }
.puzzle-hint { text-align:center; font-size:0.75rem; color:var(--warm-brown); opacity:0.6; margin-top:12px; letter-spacing:0.05em; }
.puzzle-complete { display:none; text-align:center; margin-top:24px; animation:fadeInUp 0.8s ease; }
.puzzle-complete.show { display:block; }
.reveal-img { width:min(280px,80vw); border-radius:12px; overflow:hidden; margin:0 auto 16px; box-shadow:0 8px 30px rgba(139,94,60,0.2); animation:glowReveal 2s ease-in-out infinite alternate; }
.reveal-img img { width:100%; display:block; }
@keyframes glowReveal { from{box-shadow:0 8px 30px rgba(212,168,83,0.2)} to{box-shadow:0 8px 40px rgba(212,168,83,0.5)} }
.reveal-message { font-family:'Cormorant Garamond',serif; font-size:clamp(1.1rem,4vw,1.4rem); font-style:italic; color:var(--dark-warm); line-height:1.6; padding:0 16px; margin-bottom:20px; }

/* Emotional pause */
#emotional-pause { background:linear-gradient(160deg,#2a1f17,#3d2b1f,#1e1510); }
.pause-text { font-family:'Cormorant Garamond',serif; font-size:clamp(1.2rem,4.5vw,1.8rem); font-style:italic; color:rgba(253,246,238,0.85); text-align:center; padding:0 32px; line-height:1.7; opacity:0; transition:opacity 1.5s ease; max-width:500px; }
.pause-text.visible { opacity:1; }
.floating-particle { position:absolute; width:3px; height:3px; border-radius:50%; background:var(--gold-glow); opacity:0; animation:floatParticle linear infinite; }
@keyframes floatParticle { 0%{opacity:0;transform:translateY(0) scale(0)} 20%{opacity:0.6;transform:translateY(-20px) scale(1)} 100%{opacity:0;transform:translateY(-120px) scale(0.3)} }

/* Question */
#question-screen { background:linear-gradient(160deg,#fdf6ee,#f5e6d3,#fce8e8); overflow:hidden; }
.question-text { font-family:'Cormorant Garamond',serif; font-size:clamp(1.2rem,5vw,1.8rem); font-style:italic; color:var(--dark-warm); text-align:center; padding:0 24px; margin-bottom:36px; line-height:1.6; }
.choice-wrap { position:relative; height:80px; width:300px; display:flex; align-items:center; justify-content:center; }
.yes-btn { padding:14px 36px; background:linear-gradient(135deg,#d97070,#c05555); color:white; border:none; border-radius:50px; font-family:'Dancing Script',cursive; font-size:1.3rem; cursor:pointer; transition:all 0.3s ease; box-shadow:0 4px 20px rgba(192,85,85,0.3); z-index:2; }
.yes-btn:hover { transform:scale(1.05); }
.no-btn { padding:12px 28px; background:rgba(255,255,255,0.7); border:1.5px solid rgba(139,94,60,0.3); color:var(--warm-brown); border-radius:50px; font-family:'Dancing Script',cursive; font-size:1.1rem; cursor:pointer; position:absolute; right:-10px; transition:all 0.3s cubic-bezier(0.68,-0.55,0.265,1.55); white-space:nowrap; }
.no-popup { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%) scale(0.9); background:rgba(253,246,238,0.97); border:1px solid rgba(212,168,83,0.4); border-radius:20px; padding:28px 36px; text-align:center; z-index:200; opacity:0; pointer-events:none; transition:all 0.4s ease; max-width:85vw; box-shadow:0 12px 40px rgba(139,94,60,0.2); }
.no-popup.show { opacity:1; transform:translate(-50%,-50%) scale(1); }
.no-popup p { font-family:'Cormorant Garamond',serif; font-size:1.1rem; font-style:italic; color:var(--dark-warm); }

/* Ending */
#ending { background:linear-gradient(160deg,#2a1f17,#3d2b1f); text-align:center; }
.ending-inner { max-width:500px; margin:40px auto; width:100%; }
.ending-photo { width:min(260px,75vw); border-radius:16px; overflow:hidden; margin:0 auto 28px; box-shadow:0 12px 40px rgba(0,0,0,0.3),0 0 60px rgba(212,168,83,0.15); }
.ending-photo img { width:100%; display:block; }
.ending-text { font-family:'Cormorant Garamond',serif; font-style:italic; color:rgba(253,246,238,0.9); font-size:clamp(1rem,4vw,1.4rem); line-height:1.8; margin:12px 0; opacity:0; transition:opacity 1.5s ease; }
.ending-text.show { opacity:1; }
.ending-sign { font-family:'Dancing Script',cursive; color:var(--gold-glow); font-size:1.3rem; margin-top:16px; opacity:0; transition:opacity 1.5s ease; }
.ending-sign.show { opacity:1; }

/* Confetti */
.confetti-piece { position:fixed; pointer-events:none; z-index:999; border-radius:2px; animation:confettiFall linear forwards; }
@keyframes confettiFall { 0%{opacity:1;transform:translateY(-20px) rotate(0deg)} 100%{opacity:0;transform:translateY(100vh) rotate(720deg)} }

/* Shared buttons */
.next-btn { padding:12px 32px; background:linear-gradient(135deg,var(--warm-brown),#6b3f20); color:var(--cream); border:none; border-radius:50px; font-family:'Dancing Script',cursive; font-size:1.1rem; cursor:pointer; transition:all 0.3s ease; margin-top:20px; }
.next-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(139,94,60,0.3); }
.inner-wrap { max-width:600px; margin:0 auto; width:100%; }