.boot-status { padding: 12vh 24px; text-align: center; }
.comic-web h1:focus { outline: none; }
.signin-workspace { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 40px; padding-block: 36px; }
.signin-workspace h1, .activation-workspace h1 { font-size: clamp(2rem, 5vw, 3.5rem); margin-bottom: 12px; }
.signin-workspace .comic-panel, .activation-workspace .comic-panel { margin-top: 28px; }
.signin-art { min-height: 390px; }
.activation-workspace { max-width: 640px; margin: 30px auto 80px; }
.activation-workspace form { display: flex; flex-direction: column; gap: 16px; }
.activation-code { font: inherit; font-size: 1.8rem; letter-spacing: .15em; text-transform: uppercase; color: var(--comic-white); background: var(--comic-preview); border: 2px solid var(--comic-muted); padding: 14px; width: 100%; min-width: 0; }
.activation-confirm { border-top: 2px solid var(--comic-muted); margin-top: 24px; padding-top: 16px; }
.activation-confirm strong { color: var(--comic-yellow); white-space: nowrap; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 700px) { .signin-workspace { grid-template-columns: 1fr; gap: 20px; padding-top: 10px; } .signin-art { min-height: 210px; } }