:root{--teal:#7ECFC0;--orange:#F57C1F;--ink:#1d1b2e;--slime:#8BD43A}
body{margin:0;background:var(--teal);font-family:'Archivo Narrow',sans-serif;color:var(--ink);min-height:100vh}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;background:repeating-linear-gradient(0deg,rgba(0,0,0,.05) 0 1px,transparent 1px 3px)}
.display{font-family:'Luckiest Guy',cursive;letter-spacing:.03em}
.marker{font-family:'Permanent Marker',cursive}
.card{background:#fffdf5;border:4px solid var(--ink);border-radius:22px;box-shadow:8px 8px 0 var(--orange)}
.btn{font-family:'Luckiest Guy';border:3px solid var(--ink);border-radius:999px;padding:.5rem 1.1rem;box-shadow:0 5px 0 var(--ink);transition:transform .1s;cursor:pointer}
.btn:hover{transform:translateY(-2px) rotate(-2deg)}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--ink)}
.inp{width:100%;border:3px solid var(--ink);border-radius:12px;padding:.35rem .6rem;background:#fff;font-size:15px}
.lbl{font-family:'Luckiest Guy';font-size:14px;display:block;margin:.5rem 0 .15rem}
@keyframes wobble{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg) scale(1.03)}}
.wobble{animation:wobble 2.4s ease-in-out infinite}
.wobble:hover{animation:wobble .4s ease-in-out infinite}
@keyframes squash{0%{transform:scale(0,0)}50%{transform:scale(1.3,.7)}70%{transform:scale(.85,1.15)}100%{transform:scale(1,1)}}
.squash{animation:squash .7s cubic-bezier(.3,1.6,.5,1) both}
.tv{background:linear-gradient(#5a5566,#35323f);border:4px solid var(--ink);border-radius:30px;padding:18px 18px 18px 18px}
.screen{aspect-ratio:4/3;border-radius:28px/22px;overflow:hidden;position:relative;box-shadow:inset 0 0 50px rgba(0,0,0,.5)}
.vhs::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.07) 0 2px,transparent 2px 4px);animation:track 3s linear infinite}
@keyframes track{0%{background-position:0 0}100%{background-position:0 80px}}
.trackbar{position:absolute;left:0;right:0;height:10px;background:rgba(255,255,255,.25);filter:blur(2px);animation:tb 4s linear infinite}
@keyframes tb{0%{top:-10%}100%{top:110%}}
.vhs .credits{text-shadow:2px 0 rgba(255,0,80,.6),-2px 0 rgba(0,200,255,.6)}
.bubble{position:relative;background:#fff;border:3px solid var(--ink);border-radius:18px;padding:.7rem}
.bubble::after{content:"";position:absolute;left:24px;bottom:-14px;border:12px solid transparent;border-top-color:var(--ink);border-bottom:0}
.tape{background:#222;border-radius:8px;padding:8px;cursor:pointer;transition:transform .15s}
.tape:hover{transform:rotate(-2deg) scale(1.04)}