html,body{background:#07050f;margin:0}body:has(.dfl){color:#f4e7c8;font-family:Inter,-apple-system,system-ui,sans-serif;min-height:100vh;overflow-x:hidden}.dfl{max-width:620px;margin:0 auto;padding:18px 14px 44px;display:flex;flex-direction:column;gap:16px;min-height:94vh}.dfl__hud{display:flex;align-items:center;justify-content:space-between;gap:14px}.dfl__conductor{display:flex;align-items:center;gap:12px}.dfl__noun{width:56px;height:56px;image-rendering:pixelated;border-radius:10px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}.dfl__noun--bob{animation:dflBob .34s ease-in-out}@keyframes dflBob{0%,to{transform:translateY(0) scale(1)}45%{transform:translateY(-7px) scale(1.05)}}.dfl__meta{display:flex;flex-direction:column;line-height:1}.dfl__score{font-family:Inter Tight,sans-serif;font-weight:800;font-size:38px;color:#f6c15e;font-variant-numeric:tabular-nums}.dfl__score-label{font-family:JetBrains Mono,monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#8a8a9a;margin-top:3px}.dfl__hud-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.dfl__strikes{display:flex;gap:7px}.dfl__pip{width:13px;height:13px;border-radius:50%;background:#8aeac0;box-shadow:0 0 8px #8aeac08c;transition:background .16s ease,box-shadow .16s ease,transform .16s ease}.dfl__pip--out{background:transparent;border:1.5px solid rgba(255,107,138,.55);box-shadow:none;transform:scale(.85)}.dfl__bpm{font-family:JetBrains Mono,monospace;font-size:12px;letter-spacing:.14em;color:#7ac8ed;font-variant-numeric:tabular-nums}.dfl__stage{position:relative;flex:1;min-height:300px;border-radius:16px;overflow:hidden;border:1px solid rgba(244,231,200,.1);background:linear-gradient(180deg,#0b0818,#140a24 78%,#1c0e2e);touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer}.dfl__stage--shake{animation:dflShake .22s ease}@keyframes dflShake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.dfl__canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.dfl__overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#07050fd6;backdrop-filter:blur(3px);z-index:3;text-align:center;padding:22px}.dfl__overlay--hidden{display:none}.dfl__title{font-family:JetBrains Mono,monospace;font-size:clamp(28px,8vw,48px);letter-spacing:.18em;margin:0;color:#f6c15e;text-shadow:0 0 20px rgba(246,193,94,.5)}.dfl__sub{font-family:JetBrains Mono,monospace;font-size:11px;line-height:1.7;letter-spacing:.1em;text-transform:uppercase;color:#8a8a9a;margin:0;max-width:340px}.dfl__best{font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#d4a437;margin:0}.dfl__go{margin-top:8px;font-family:JetBrains Mono,monospace;font-size:14px;font-weight:800;letter-spacing:.2em;color:#07050f;background:#f6c15e;border:0;border-radius:14px;padding:14px 30px;cursor:pointer;transition:transform .1s ease,background .16s ease}.dfl__go:hover{transform:translateY(-1px);background:#ffd98a}.dfl__speech{font-family:JetBrains Mono,monospace;font-size:12px;letter-spacing:.06em;color:#f4e7c8;background:#ffffff0d;border:1px solid rgba(244,231,200,.14);border-radius:4px 14px 14px;padding:10px 14px;align-self:center;text-align:center;min-height:20px}.dfl__controls{display:flex;justify-content:center}.dfl__tap{font-family:JetBrains Mono,monospace;font-size:18px;font-weight:800;letter-spacing:.16em;color:#07050f;background:#8aeac0;border:0;border-radius:16px;padding:18px 54px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform 80ms ease,filter .14s ease;box-shadow:0 6px 20px #8aeac038}.dfl__tap span{display:inline-block;margin-left:8px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#07050f8c}.dfl__tap:hover{filter:brightness(1.08)}.dfl__tap:active{transform:scale(.95)}.dfl__siblings{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;font-family:JetBrains Mono,monospace;font-size:12px}.dfl__siblings a{color:#d4a437;text-decoration:none}.dfl__siblings a:hover{text-decoration:underline}@media(max-width:480px){.dfl__stage{min-height:240px}.dfl__score{font-size:32px}.dfl__tap{padding:16px 40px;font-size:16px}}@media(prefers-reduced-motion:reduce){.dfl *,.dfl *:before,.dfl *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}