/* Landing page extras: the draft loading sheet. */
.shake { animation: shake .4s }
@keyframes shake { 25% { transform: translateX(-6px) } 75% { transform: translateX(6px) } }

/* loading sheet */
.sheet { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: rgba(20,22,28,.28); backdrop-filter: blur(6px); padding: 16px }
.sheet[hidden] { display: none }
.sheet-card { width: min(400px, 100%); background: #fff; border-radius: 22px; padding: 26px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.45); font: 15px/1.5 Inter, system-ui, sans-serif; color: #16171a }
.sheet-doc { width: 64px; height: 80px; border-radius: 10px; border: 1px solid #ececef; background: #fff; box-shadow: 0 10px 24px -12px rgba(0,0,0,.3); padding: 12px 10px; display: grid; gap: 6px; align-content: start; margin-bottom: 18px }
.sheet-doc i { display: block; height: 5px; border-radius: 3px; background: #ececef; transform-origin: left; animation: type 1.6s ease-in-out infinite }
.sheet-doc i:first-child { height: 8px; background: #16171a; width: 80% }
.sheet-doc i:nth-child(2) { animation-delay: .2s } .sheet-doc i:nth-child(3) { animation-delay: .4s; width: 70% } .sheet-doc i:nth-child(4) { animation-delay: .6s } .sheet-doc i:nth-child(5) { animation-delay: .8s; width: 55% }
@keyframes type { 0% { transform: scaleX(0) } 50%, 100% { transform: scaleX(1) } }
.failed .sheet-doc i { animation: none }
.sheet-t { font-size: 18px; letter-spacing: -.02em; display: block }
.sheet-steps { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 9px; font-size: 14px; color: #a1a4ab }
.sheet-steps li { display: flex; align-items: center; gap: 10px }
.sheet-steps li::before { content: ""; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid #dcdde1; flex: none; box-sizing: border-box }
.sheet-steps li.on { color: #16171a }
.sheet-steps li.on::before { border-color: var(--accent, #3aa0f3); border-top-color: transparent; animation: spin .8s linear infinite }
.sheet-steps li.done { color: #61646b }
.sheet-steps li.done::before { border: 0; background: #16a34a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") }
.failed .sheet-steps li.on::before { animation: none; border-color: #ea4a5c }
@keyframes spin { to { transform: rotate(360deg) } }
.sheet-err { margin: 14px 0 0; color: #c7283b; font-size: 14px }
.sheet-x { margin-top: 14px; height: 38px; padding: 0 14px; border-radius: 10px; border: 1px solid #ececef; background: #fff; font: 600 14px Inter, sans-serif; cursor: pointer }