/* Basic reset */
*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Apple Color Emoji','Segoe UI Emoji',sans-serif;background:radial-gradient(1200px 800px at 20% -10%,#fdf5d6 0,#fff 50%),linear-gradient(180deg,#fff,#f7f7f7);color:#111}

/* Layout */
.container{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}
.card{width:min(720px,92vw);background:#fff;border:1px solid #eee;border-radius:1.25rem;padding:2.5rem;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.emoji{font-size:56px;line-height:1;margin-bottom:.25rem}
h1{font-size:clamp(1.6rem,3.6vw,2.4rem);margin:.25rem 0 0.5rem;font-weight:800}
.lead{font-size:clamp(1rem,2.4vw,1.15rem);color:#333;margin:0 0 1.25rem}
.badge{display:inline-block;background:#111;color:#fff;padding:.25rem .5rem;border-radius:.5rem;font-size:.85rem}

/* Animated construction tape */
.tape{position:relative;display:block;overflow:hidden;border-radius:.75rem;margin:1.25rem 0}
.tape:before{content:'';position:absolute;inset:-2px;border-radius:.9rem;padding:2px;background:repeating-linear-gradient(135deg,#111 0,#111 18px,#f7c948 18px,#f7c948 36px);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.tape span{display:inline-block;padding:0.75rem 1rem;font-weight:700;letter-spacing:.08em;white-space:nowrap;animation:marquee 12s linear infinite}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* Footer */
footer{opacity:.7;margin-top:1.25rem;font-size:.9rem}

/* Prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .tape span{animation:none}
}