/* Production: PSU 1.3 interview. Everything but the words is in art/plate.png. */
@font-face { font-family: "Elite"; src: url("fonts/SpecialElite-Regular.ttf"); }
.tv { font-family: "Elite", "Courier New", monospace; -webkit-text-stroke: .07cqw currentColor; }
.head { left: 6.7%; top: 4.6%; right: 5%; }
.head p { margin: 0; color: #ecebe4; text-shadow: .25cqw .25cqw 0 #111, 0 0 .5cqw rgba(0,0,0,.7); }
.head .k { font-size: 5.6cqw; line-height: 1.1; padding-left: 17%; }
.head .l { font-size: 4.2cqw; line-height: 1.15; padding-left: 7%; margin-top: .4cqw; }
.qs { left: 11.5%; top: 33%; right: 8%; margin: 0; padding: 0; list-style: none; display: grid; gap: 3.2cqw; }
.qs li { position: relative; padding-left: 3.4cqw; text-indent: -3.4cqw; font-size: 3.6cqw; line-height: 1.3; color: #e2e0d8;
  text-shadow: .22cqw .22cqw 0 #111, 0 0 .5cqw rgba(0,0,0,.8); }
.qs li .n { display: inline-block; text-indent: 0; }
.arr { position: absolute; left: -6.4cqw; top: .35em; width: 4cqw; height: 3.4cqw; text-indent: 0; clip-path: polygon(0 0, 100% 50%, 0 100%);
  background: radial-gradient(circle at 25% 35%, #c8ffbe, #34d02c 40%, #108a0e 80%); opacity: .8; }
.qs li.on .arr { opacity: 1; width: 5cqw; height: 4.4cqw; left: -7cqw; top: .15em; filter: drop-shadow(0 0 .8cqw #3dff38); }
.qs li.on { color: #fff; }
.scroll { left: 6.7%; top: 77.5%; margin: 0; font-size: 2.7cqw; color: #e6e4dc; text-shadow: .2cqw .2cqw 0 #111; }

/* The lit arrow throbs like the disc's. */
body.lit .qs li.on .arr { animation: throb .9s steps(6) infinite; }
@keyframes throb { 50% { filter: drop-shadow(0 0 .2cqw #3dff38) brightness(.8); } }