/* ---------- SCHIFFBRUCH ----------
   Co-op on a sinking ship with secret saboteurs. The ship lives on the canvas; everything here is the DOM HUD above it.
   Layout: .sb = column (top bar, middle). The canvas draws the ship into .sb-stage's rectangle, so the ship always fits the
   space the HUD leaves free. Only buttons and the vote / final overlays take pointer events: every touch on the stage
   reaches the canvas (touch joystick). No backdrop-filter anywhere: the canvas behind redraws every frame. */
.sb-root { --sb-sea: #3de6ff; --sb-gold: #ffd23d; --sb-green: #4dff9a; --sb-red: #ff5470; --sb-wood: #c89a5a; --sb-panel: rgba(8, 16, 34, .86); --sb-line: rgba(120, 190, 255, .28); }
.sb { position: absolute; inset: 0; display: flex; flex-direction: column; pointer-events: none; color: var(--text); font-family: var(--font); user-select: none; -webkit-user-select: none; }
.sb button { font: inherit; color: inherit; pointer-events: auto; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: none; }
.sb [hidden] { display: none !important; }

/* top bar: rescue clock, water level, role */
.sb-top { position: relative; display: flex; align-items: stretch; justify-content: center; gap: 10px; padding: 8px 56px 4px 10px; min-height: 58px; }
.sb-clock, .sb-sink { display: flex; flex-direction: column; justify-content: center; gap: 3px; padding: 5px 14px 6px; border-radius: 14px; background: var(--sb-panel); border: 1px solid var(--sb-line); }
.sb-clock { min-width: 190px; align-items: center; }
.sb-sink { flex: 1 1 260px; max-width: 420px; position: relative; }
.sb-lbl { font-size: 10px; font-weight: 900; letter-spacing: 1.6px; color: #9fc4e6; }
.sb-time { font-family: var(--display); font-size: 26px; line-height: 1; letter-spacing: 1px; color: #fff; text-shadow: 0 0 16px rgba(61, 230, 255, .55), 0 2px 0 rgba(4, 10, 24, .9); font-variant-numeric: tabular-nums; }
.sb-time.low { color: var(--sb-gold); animation: sb-blink .5s linear infinite alternate; }
.sb-rbar, .sb-sbar { position: relative; height: 8px; border-radius: 6px; background: rgba(255, 255, 255, .12); overflow: hidden; width: 100%; }
.sb-rbar i { display: block; height: 100%; width: 100%; transform-origin: 0 50%; transform: scaleX(0); border-radius: 6px; background: linear-gradient(90deg, #3de6ff, #4dff9a); box-shadow: 0 0 10px rgba(61, 230, 255, .7); }
.sb-sbar { height: 12px; overflow: visible; border-radius: 7px; }
.sb-sbar i { display: block; height: 100%; width: 100%; border-radius: 7px; clip-path: inset(0 calc((1 - var(--k, 0)) * 100%) 0 0 round 7px); background: linear-gradient(90deg, #2f9bff 0%, #3de6ff 40%, #ffd23d 70%, #ff5470 100%); }
.sb-sbar b { position: absolute; top: -3px; bottom: -3px; width: 3px; margin-left: -1.5px; border-radius: 2px; background: #fff; box-shadow: 0 0 6px #fff; }
.sb-sbar.danger i { filter: saturate(1.3); }
.sb-sbar.crit { animation: sb-blink .35s linear infinite alternate; }
.sb-spct { position: absolute; right: 12px; top: 4px; font-size: 12px; font-weight: 900; color: #cfe6ff; }
.sb-chip { align-self: center; padding: 5px 13px; border-radius: 14px; font-weight: 900; font-size: 13px; letter-spacing: .6px; white-space: nowrap; background: var(--sb-panel); border: 1px solid var(--sb-line); }
.sb-rolechip { color: var(--sb-sea); border-color: rgba(61, 230, 255, .6); }
.sb-rolechip.sab { color: #ff8a9a; border-color: rgba(255, 84, 112, .8); box-shadow: 0 0 14px rgba(255, 84, 112, .35); }
.sb-mute { position: absolute; right: 10px; top: 9px; background: var(--sb-panel); border: 1px solid rgba(255, 255, 255, .18); border-radius: 12px; padding: 4px 10px; font-size: 16px; line-height: 1.3; }
@keyframes sb-blink { to { opacity: .55; } }

/* middle: stage (the canvas shows through) + player list */
.sb-mid { flex: 1; min-height: 0; display: flex; flex-direction: row; }
.sb-stage { position: relative; flex: 1; min-width: 0; min-height: 0; }
.sb-side { width: 236px; flex: none; padding: 6px 10px 10px 0; overflow: auto; display: flex; flex-direction: column; gap: 8px; pointer-events: auto; }
.sb-list { display: flex; flex-direction: column; gap: 5px; }
.sb-row { position: relative; display: flex; align-items: center; gap: 6px; padding: 3px 10px 3px 6px; border-radius: 16px; background: var(--sb-panel); border: 1px solid rgba(255, 255, 255, .12); min-height: 36px; overflow: hidden; }
.sb-row::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--pc, #9a92c4); box-shadow: 0 0 8px var(--pc, #9a92c4); }
.sb-row.me { border-color: var(--sb-gold); box-shadow: 0 0 0 1px rgba(255, 210, 61, .35); }
.sb-row.sabrow { border-color: rgba(255, 84, 112, .75); }
.sb-row.voted { border-color: rgba(77, 255, 160, .7); }
.sb-row.out { opacity: .5; filter: grayscale(.8); }
.sb-av { display: flex; flex: none; width: 28px; height: 28px; margin-left: 2px; }
.sb-av canvas { width: 28px; height: 28px; display: block; }
.sb-nm { flex: 1; min-width: 0; font-size: 13px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-tag { flex: none; font-size: 9px; font-weight: 900; letter-spacing: .6px; color: #9fc4e6; }
.sb-tag.sab { color: #ff7a8c; }
.sb-sc { font-size: 10px; font-weight: 800; color: #cfe6ff; flex: none; }
.sb-stt { font-size: 10px; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; color: #9fe8c0; flex: none; text-align: right; }
.sb-row.out .sb-stt { color: #ff8a9a; }
.sb-row.voted .sb-stt { color: var(--sb-green); }

/* action buttons in the side panel (desktop) */
.sb-act { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px; border-radius: 14px; border: 2px solid rgba(255, 210, 61, .7); background: linear-gradient(180deg, rgba(60, 46, 8, .92), rgba(36, 26, 4, .92)); color: #ffe9a8; text-align: left; position: relative; overflow: hidden; }
.sb-act b { font-size: 13px; font-weight: 900; letter-spacing: .3px; position: relative; z-index: 1; }
.sb-act small { font-size: 11px; font-weight: 900; padding: 1px 7px; border-radius: 6px; background: rgba(255, 255, 255, .15); position: relative; z-index: 1; }
.sb-act:hover:not(.off) { filter: brightness(1.15); }
.sb-act.off { opacity: .55; cursor: default; border-color: rgba(255, 255, 255, .22); }
.sb-sab { border-color: rgba(255, 84, 112, .85); background: linear-gradient(180deg, rgba(86, 12, 28, .92), rgba(48, 6, 16, .92)); color: #ffc0c9; }
.sb-sab::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .55) calc(var(--cd, 0) * 100%), transparent 0); }

/* big centre messages, toast, spectator note, hint */
.sb-big { position: absolute; left: 50%; top: 40%; transform: translate(-50%, -50%); font-family: var(--display); font-size: clamp(56px, 15vmin, 150px); line-height: 1; color: #fff; letter-spacing: 2px; white-space: nowrap; text-shadow: 0 0 28px var(--sb-sea), 0 6px 0 rgba(4, 10, 24, .9); }
.sb-big.go { color: var(--sb-green); text-shadow: 0 0 30px var(--sb-green), 0 6px 0 rgba(4, 10, 24, .9); }
.sb-big.meet { font-size: clamp(40px, 11vmin, 110px); color: #ffe9a8; text-shadow: 0 0 34px var(--sb-red), 0 0 12px var(--sb-gold), 0 6px 0 rgba(60, 5, 20, .9); }
.sb-big.on { animation: sb-pop .9s cubic-bezier(.2, 1.3, .3, 1) both; }
@keyframes sb-pop { 0% { transform: translate(-50%, -50%) scale(1.7); opacity: 0; } 22% { transform: translate(-50%, -50%) scale(1); opacity: 1; } 80% { opacity: 1; } 100% { transform: translate(-50%, -50%) scale(.85); opacity: 0; } }
.sb-toast { position: absolute; left: 50%; top: 8px; transform: translateX(-50%); max-width: 92%; padding: 6px 14px; border-radius: 12px; font-size: 14px; font-weight: 800; text-align: center; color: #fff; background: rgba(120, 10, 30, .88); border: 1px solid rgba(255, 90, 120, .7); opacity: 0; transition: opacity .2s; }
.sb-toast.soft { background: rgba(10, 30, 60, .88); border-color: rgba(120, 190, 255, .6); }
.sb-toast.show { opacity: 1; }
.sb-spec { position: absolute; left: 50%; top: 40px; transform: translateX(-50%); padding: 5px 16px; border-radius: 14px; font-size: 14px; font-weight: 900; color: #cfd6ff; background: var(--sb-panel); border: 1px solid rgba(207, 214, 255, .4); white-space: nowrap; }
.sb-hint { position: absolute; left: 0; right: 0; bottom: 4px; text-align: center; font-size: 12px; font-weight: 700; color: rgba(214, 232, 252, .78); text-shadow: 0 2px 0 rgba(4, 10, 24, .9); padding: 0 8px; }

/* role / how-to card at the start */
.sb-intro { position: absolute; left: 50%; top: 6%; transform: translateX(-50%); width: min(460px, 92%); padding: 12px 18px 14px; border-radius: 20px; text-align: center; background: rgba(6, 14, 32, .9); border: 2px solid rgba(61, 230, 255, .7); box-shadow: 0 0 34px rgba(61, 230, 255, .25); animation: sb-pop-in .5s cubic-bezier(.2, 1.4, .3, 1) both; }
.sb-intro.sab { border-color: rgba(255, 84, 112, .9); box-shadow: 0 0 40px rgba(255, 84, 112, .4); background: rgba(40, 6, 16, .92); }
.sb-itit { font-family: var(--display); font-size: clamp(24px, 5.2vw, 38px); letter-spacing: 1px; color: var(--sb-sea); text-shadow: 0 0 18px rgba(61, 230, 255, .6); }
.sb-intro.sab .sb-itit { color: #ff6a80; text-shadow: 0 0 20px rgba(255, 84, 112, .8); }
.sb-isub { margin: 4px 0 8px; font-size: 14px; font-weight: 800; color: #e4f0ff; }
.sb-itips { display: flex; flex-direction: column; gap: 3px; align-items: stretch; text-align: left; }
.sb-itip { font-size: 12.5px; font-weight: 700; color: #b8d4ee; padding-left: 16px; position: relative; }
.sb-itip::before { content: "›"; position: absolute; left: 4px; color: var(--sb-gold); font-weight: 900; }
@keyframes sb-pop-in { from { transform: translateX(-50%) scale(.6); opacity: 0; } }

/* touch buttons (shown on touch devices only) */
.sb-btns { position: absolute; right: 10px; bottom: 12px; display: flex; align-items: flex-end; gap: 12px; }
.sb-btn { position: relative; border-radius: 50%; border: 3px solid rgba(255, 255, 255, .55); color: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; box-shadow: 0 4px 0 rgba(0, 0, 0, .35), 0 0 18px rgba(0, 0, 0, .35); }
.sb-btn b { position: relative; z-index: 1; font-family: var(--display); letter-spacing: .5px; text-shadow: 0 2px 0 rgba(4, 10, 24, .85); text-align: center; line-height: 1.05; }
.sb-bwork { width: 112px; height: 112px; background: radial-gradient(circle at 35% 30%, #ffd98a, #c0791f 72%); border-color: #fff0d0; }
.sb-bwork b { font-size: 15px; }
.sb-bwork.on { filter: brightness(1.25); box-shadow: 0 4px 0 rgba(0, 0, 0, .35), 0 0 30px rgba(255, 210, 61, .85); }
.sb-bsab { width: 80px; height: 80px; background: radial-gradient(circle at 35% 30%, #ff8a9a, #b81a38 72%); border-color: #ffd0d8; }
.sb-bsab b { font-size: 11px; }
.sb-bmeet { width: 76px; height: 76px; background: radial-gradient(circle at 35% 30%, #8ae8ff, #1b6aa8 72%); border-color: #d6f6ff; }
.sb-bmeet b { font-size: 10px; }
.sb-bsab::after, .sb-bmeet::after { content: ""; position: absolute; inset: 0; background: conic-gradient(rgba(4, 10, 24, .6) calc(var(--cd, 0) * 1turn), transparent 0); }
.sb-btn.off { filter: saturate(.5) brightness(.85); }
.sb-btn.down { transform: translateY(3px) scale(.96); box-shadow: 0 1px 0 rgba(0, 0, 0, .35); }

/* vote + result overlay (covers everything, blocks the stage) */
.sb-vote { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 10px; background: rgba(3, 8, 20, .74); pointer-events: auto; overflow: auto; touch-action: pan-y; animation: sb-fade .3s both; }
.sb-vote[data-m="result"] { background: rgba(3, 8, 20, .16); align-items: flex-start; pointer-events: none; }
.sb-vote[data-m="result"] .sb-res { margin-top: 52px; }
.sb .sb-pick { touch-action: pan-y; }
.sb-vcard { width: min(760px, 100%); max-height: 100%; overflow: auto; padding: 14px 18px 16px; border-radius: 22px; text-align: center; background: rgba(8, 18, 40, .94); border: 2px solid rgba(255, 210, 61, .65); box-shadow: 0 0 44px rgba(255, 210, 61, .2); }
.sb-vtitle { font-family: var(--display); font-size: clamp(22px, 5vw, 36px); letter-spacing: 2px; color: var(--sb-gold); text-shadow: 0 0 20px rgba(255, 210, 61, .5), 0 3px 0 rgba(4, 10, 24, .9); }
.sb-vby { margin-top: 2px; font-size: 14px; font-weight: 800; color: #cfe6ff; }
.sb-vtimer { height: 9px; margin: 10px auto 4px; width: min(420px, 90%); border-radius: 6px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.sb-vtimer i { display: block; height: 100%; width: 100%; transform-origin: 0 50%; border-radius: 6px; background: linear-gradient(90deg, var(--sb-green), var(--sb-gold)); }
.sb-vtimer.low i { background: linear-gradient(90deg, var(--sb-red), #ff8a3d); animation: sb-blink .25s linear infinite alternate; }
.sb-vinfo { font-size: 12px; font-weight: 800; color: #9fc4e6; margin-bottom: 8px; }
.sb-vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 8px; }
.sb-pick { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 6px 7px; border-radius: 16px; border: 2px solid rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .06); transition: transform .12s, border-color .12s, background .12s; }
.sb-pick::before { content: ""; position: absolute; left: 10px; right: 10px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: var(--pc, #9a92c4); }
.sb-pick:hover:not(:disabled) { transform: translateY(-2px); border-color: rgba(255, 255, 255, .5); }
.sb-pick:disabled { cursor: default; opacity: .8; }
.sb-pick.sel { border-color: var(--sb-gold); background: rgba(255, 210, 61, .16); box-shadow: 0 0 18px rgba(255, 210, 61, .35); }
.sb-pick.sel::after { content: "DEINE STIMME"; position: absolute; right: 6px; top: 5px; font-size: 8px; font-weight: 900; letter-spacing: .5px; color: #1a1200; background: var(--sb-gold); padding: 1px 5px; border-radius: 6px; }
.sb-pav { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; font-size: 30px; }
.sb-pav canvas { width: 52px; height: 52px; display: block; }
.sb-pnm { max-width: 100%; font-size: 14px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-pst { min-height: 12px; font-size: 10px; font-weight: 800; color: var(--sb-green); }
.sb-pkey { position: absolute; left: 7px; top: 5px; font-size: 10px; font-weight: 900; color: #9fc4e6; opacity: .8; }
.sb-skip { border-style: dashed; }
.sb-vfoot, .sb-vspec { margin-top: 10px; font-size: 12px; font-weight: 700; color: #9fc4e6; }
.sb-res { border-color: rgba(120, 190, 255, .7); box-shadow: 0 0 44px rgba(61, 230, 255, .2); }
.sb-res .sb-vtitle { color: var(--sb-sea); text-shadow: 0 0 20px rgba(61, 230, 255, .5), 0 3px 0 rgba(4, 10, 24, .9); }
.sb-bars { display: flex; flex-direction: column; gap: 6px; margin: 12px auto 8px; width: min(520px, 100%); }
.sb-bar { display: grid; grid-template-columns: minmax(80px, 150px) 1fr 28px; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; text-align: left; }
.sb-bn { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-bt { display: block; height: 16px; border-radius: 8px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.sb-bt i { display: block; height: 100%; border-radius: 8px; background: var(--pc, #9a92c4); animation: sb-grow .9s cubic-bezier(.2, .9, .3, 1) both; }
.sb-bar.top .sb-bt i { box-shadow: 0 0 12px var(--pc, #ff5470); }
.sb-bar.top .sb-bn { color: var(--sb-gold); }
.sb-bc { text-align: right; color: #cfe6ff; }
@keyframes sb-grow { from { width: 0; } }
.sb-verdict { margin-top: 10px; font-family: var(--display); font-size: clamp(20px, 4.6vw, 30px); color: #fff; text-shadow: 0 0 16px rgba(255, 84, 112, .6), 0 3px 0 rgba(4, 10, 24, .9); animation: sb-fadein .5s 1.3s both; overflow-wrap: anywhere; }
.sb-verdict.none { color: #cfe6ff; text-shadow: 0 3px 0 rgba(4, 10, 24, .9); animation-delay: .5s; }
.sb-vrole { margin-top: 2px; font-size: 18px; font-weight: 900; color: #9fe8c0; animation: sb-fadein .5s 1.9s both; }
.sb-vrole.sab { color: #ff6a80; text-shadow: 0 0 14px rgba(255, 84, 112, .7); }
.sb-vrole.crew { color: var(--sb-sea); }
@keyframes sb-fadein { from { opacity: 0; transform: translateY(8px); } }
@keyframes sb-fade { from { opacity: 0; } }

/* final overlay */
.sb-final { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 10px; background: rgba(3, 8, 20, .55); animation: sb-fade .4s both; }
.sb-fcard { text-align: center; padding: 14px 26px 16px; border-radius: 24px; background: rgba(8, 18, 40, .9); border: 2px solid rgba(61, 230, 255, .7); box-shadow: 0 0 44px rgba(61, 230, 255, .3); animation: sb-card-in .5s cubic-bezier(.2, 1.4, .3, 1) both; max-width: min(520px, 94%); max-height: 100%; overflow: auto; }
.sb-fcard.sab { border-color: rgba(255, 84, 112, .85); box-shadow: 0 0 44px rgba(255, 84, 112, .35); background: rgba(34, 6, 16, .92); }
.sb-fico { font-size: 54px; line-height: 1; animation: sb-bounce .9s ease-in-out infinite alternate; }
.sb-ftitle { font-family: var(--display); font-size: clamp(26px, 6vw, 44px); color: var(--sb-gold); text-shadow: 0 0 22px rgba(255, 210, 61, .6), 0 4px 0 rgba(4, 10, 24, .9); margin: 4px 0 2px; overflow-wrap: anywhere; }
.sb-fcard.sab .sb-ftitle { color: #ff6a80; text-shadow: 0 0 22px rgba(255, 84, 112, .7), 0 4px 0 rgba(4, 10, 24, .9); }
.sb-fsub { font-size: 18px; font-weight: 900; color: #e4f0ff; }
.sb-fwhy { margin-top: 2px; font-size: 13px; font-weight: 700; color: #9fc4e6; }
.sb-fyou { margin-top: 8px; font-size: 16px; font-weight: 900; }
.sb-fyou.win { color: var(--sb-green); }
.sb-fyou.lose { color: #ff8a9a; }
.sb-fsabs { margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .15); }
.sb-fh { font-size: 11px; font-weight: 900; letter-spacing: 1.2px; text-transform: uppercase; color: #9fc4e6; margin-bottom: 4px; }
.sb-fline { display: flex; gap: 8px; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; color: #ffc0c9; margin: 2px 0; }
.sb-fn { overflow-wrap: anywhere; }
.sb-fbest { margin-top: 10px; font-size: 12px; font-weight: 800; color: #cfe6ff; }
@keyframes sb-card-in { from { transform: scale(.6); opacity: 0; } }
@keyframes sb-bounce { to { transform: translateY(-8px) rotate(4deg); } }

/* narrow screens: the list becomes a compact wrapping row above the stage */
@media (max-width: 860px) {
  .sb-top { padding: 6px 52px 2px 6px; gap: 6px; min-height: 50px; }
  .sb-clock { min-width: 0; padding: 3px 10px 4px; }
  .sb-time { font-size: 20px; }
  .sb-sink { padding: 3px 10px 4px; flex-basis: 140px; }
  .sb-lbl { font-size: 9px; letter-spacing: 1px; }
  .sb-chip { padding: 3px 9px; font-size: 11px; }
  .sb-mid { flex-direction: column; }
  .sb-side { order: -1; width: auto; padding: 2px 8px 0; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; overflow: visible; gap: 4px; }
  .sb-list { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 4px; }
  .sb-row { min-height: 0; padding: 2px 8px 2px 10px; border-radius: 999px; flex: 0 1 auto; max-width: 48%; }
  .sb-av, .sb-stt, .sb-sc { display: none; }
  .sb-nm { font-size: 11px; max-width: 80px; }
  .sb-tag { font-size: 8px; }
  .sb-row.out .sb-nm { text-decoration: line-through; }
  .sb-act { padding: 4px 10px; border-radius: 999px; }
  .sb-act small { display: none; }
  .sb-act b { font-size: 11px; }
  .sb-hint { font-size: 11px; bottom: 2px; }
  .sb-bwork { width: 96px; height: 96px; }
  .sb-bsab, .sb-bmeet { width: 66px; height: 66px; }
  .sb-spec { top: 6px; }
  .sb-pick { padding: 6px 4px; }
  .sb-vgrid { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); }
}
@media (max-height: 520px) {
  .sb-intro { top: 2%; padding: 6px 12px 8px; }
  .sb-itips { display: none; }
  .sb-btns { gap: 8px; }
  .sb-bwork { width: 84px; height: 84px; }
  .sb-bsab, .sb-bmeet { width: 58px; height: 58px; }
  .sb-hint { display: none; }
  .sb-vcard { padding: 8px 12px 10px; }
  .sb-pav, .sb-pav canvas { width: 38px; height: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  .sb-big.on, .sb-time.low, .sb-sbar.crit, .sb-fico, .sb-intro, .sb-fcard, .sb-vtimer.low i { animation: none; }
  .sb-big.on { opacity: 1; }
  .sb-verdict, .sb-vrole { animation: none; }
}
