.brand a { text-decoration: none; }
.brand-symbol { display: grid; place-items: center; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.brand-symbol:focus-visible { outline: 2px solid var(--violet); outline-offset: 8px; border-radius: 3px; }
.brand-symbol .tc-reduced-logo { width: clamp(72px, 24vw, 135px); height: auto; filter: none; }
.drop-word { cursor: pointer; touch-action: manipulation; }
.timecapsule { position: fixed; inset: 0; z-index: 80; overflow: hidden; pointer-events: none; isolation: isolate; }
.tc-wash, .tc-blackout, .tc-gravity { position: absolute; inset: 0; opacity: 0; }
.tc-wash { background: radial-gradient(ellipse at 50% 40%, rgb(103 19 163 / .25), rgb(22 6 42 / .35) 55%, transparent 90%); }
.tc-blackout { z-index: 100; background: #030407; }
.tc-gravity { z-index: 45; width: min(72vw, 720px); aspect-ratio: 1; inset: auto; border-radius: 50%; background: radial-gradient(ellipse, rgb(12 4 22 / .95) 9%, rgb(105 54 167 / .22) 36%, transparent 68%); }
.tc-particles { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 35; pointer-events: none; }
.tc-sticker { position: absolute; top: 0; left: 0; transform-origin: center; will-change: transform, opacity; container-type: inline-size; }
.tc-sticker > .tc-face { display: block; width: 100%; transform-origin: center; }
.tc-face img, .tc-face svg { display: block; width: 100%; height: auto; pointer-events: none; }
.tc-legacy .tc-face { filter: drop-shadow(1px 0 0 #faf5ff) drop-shadow(-1px 0 0 #faf5ff) drop-shadow(0 1px 0 #faf5ff) drop-shadow(0 -1px 0 #faf5ff) drop-shadow(0 12px 25px rgb(0 0 0 / .45)); }
.tc-cat .tc-face { border: 5px solid #fbf9f3; border-radius: 17%; overflow: hidden; box-shadow: 0 15px 30px rgb(0 0 0 / .4); }
.tc-astronaut .tc-face { border: 6px solid #fbf9f3; border-radius: 45% 45% 38% 38%; overflow: hidden; box-shadow: 0 18px 30px rgb(0 0 0 / .4); }
.tc-astronaut img { aspect-ratio: 1; object-fit: cover; object-position: 50% 50%; }
.tc-artist .tc-face { padding: 17px 21px; background: #100a20; border: 4px solid #fbf9f3; border-radius: 15px; box-shadow: 0 12px 26px rgb(0 0 0 / .5); }
.tc-excision .tc-face { padding: 0; overflow: hidden; border-radius: 18%; background: white; }
.tc-excision img { aspect-ratio: 1; object-fit: cover; }
.tc-zomboy .tc-face, .tc-skrillex .tc-face { background: #fff; border: 5px solid #fff; border-radius: 24%; padding: 9px; box-shadow: 0 15px 26px rgb(0 0 0 / .45); }
.tc-zomboy svg, .tc-skrillex svg { aspect-ratio: 1; overflow: hidden; }
.tc-type .tc-face { border: 6px solid #b49af5; border-radius: 16px; padding: 21px 26px 26px; font-family: Oswald, sans-serif; line-height: 1.05; text-align: center; color: #27123f; background: #fbf9f3; box-shadow: 0 15px 25px rgb(0 0 0 / .45); }
.tc-type b { font-weight: 400; font-size: clamp(30px, 14cqi, 66px); display: block; }
.tc-type small { display: block; font: clamp(11px, 3.1cqi, 14px) 'Source Sans Pro', sans-serif; margin-top: 12px; }
.tc-question em { font-style: normal; color: #6d35a5; }
.tc-record .tc-face { aspect-ratio: 1; display: grid; place-content: center; border-radius: 50%; background: repeating-radial-gradient(circle, #0c0914 0 3px, #211931 4px 5px); border: 4px solid #f4eef8; color: #d4ff24; font-family: Oswald, sans-serif; font-size: 26cqi; text-align: center; box-shadow: 0 15px 25px rgb(0 0 0 / .5); }
.tc-record small { display: block; font: clamp(8px, 6.4cqi, 12px) 'Source Sans Pro', sans-serif; color: #fbf9f3; }
.tc-round .tc-face { aspect-ratio: 1; border: 4px solid #fbf9f3; border-radius: 50%; background: #100a20; padding: 12%; display: grid; place-items: center; color: #d4ff24; box-shadow: 0 12px 25px rgb(0 0 0 / .5); }
.tc-round img { width: 100%; max-height: 100%; object-fit: contain; }
.tc-round.tc-circus .tc-face { padding: 0; overflow: hidden; background: #fbf9f3; }
.tc-monstercat .tc-face { background: #fbf9f3; }
.tc-cd .tc-face { aspect-ratio: 1; display: grid; place-items: center; border: 3px solid #fbf9f3; border-radius: 50%; background: conic-gradient(from 25deg, #e5e1ef, #9b8ab9, #e9d5f7, #6a9b9d, #fbf9f3, #c1a0cb, #b8c9e7, #e5e1ef); box-shadow: 0 12px 25px rgb(0 0 0 / .4); }
.tc-cd-hole { width: 15%; aspect-ratio: 1; background: #100a20; border-radius: 50%; box-shadow: 0 0 0 8px rgb(251 249 243 / .35); }
.tc-biohazard { display: block; font-family: Arial, sans-serif; font-size: 76cqi; line-height: .8; }
.tc-round.tc-basshazard .tc-face { padding: 0; }
.tc-fragment { position: fixed; margin: 0; transform-origin: 50% 50%; pointer-events: none; will-change: transform, opacity; }
.tc-modern { gap: 15px; }
.tc-status { position: fixed; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.tc-idle-hint { position: fixed; z-index: 22; bottom: max(70px, env(safe-area-inset-bottom)); left: 20px; right: 20px; margin: 0; text-align: center; font-size: 13px; color: #c5c0d5; opacity: 0; transform: translateY(20px); pointer-events: none; }
body[data-timecapsule] .brand-symbol { pointer-events: none; }
body[data-timecapsule] .tc-idle-hint { visibility: hidden; }
@media (max-width: 600px) {
  .tc-artist .tc-face { padding: 12px; border-width: 3px; }
  .tc-round.tc-artist .tc-face { padding: 14%; }
  .tc-question .tc-face { padding: 18px; }
  .tc-modern { gap: 10px; }
  .tc-idle-hint { bottom: 78px; font-size: 12px; }
}