:root { color-scheme: dark; font-family: Georgia, "Times New Roman", serif; background: #0a0908; color: #d6c9ad; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; overscroll-behavior: none; }
#darkveil-canvas { position: fixed; inset: 0; display: block; width: 100vw; height: 100vh; height: 100dvh; outline: none; touch-action: none; }
#darkveil-status { position: fixed; inset: 0; display: grid; place-items: center; padding: 28px; background: radial-gradient(ellipse at 50% 65%, #241411, #0a0908 68%); text-align: center; }
[hidden] { display: none !important; }
.loading-card { width: min(100%, 430px); }
.eyebrow { color: #897758; font: 11px/1.6 monospace; letter-spacing: .3em; }
h1 { margin: 22px 0; color: #e1d0aa; font-size: clamp(38px, 8vw, 64px); font-weight: 400; line-height: 1.1; letter-spacing: .12em; text-shadow: 0 2px #000; }
.loading-rule { height: 1px; width: 68%; margin: 28px auto; background: linear-gradient(90deg, transparent, #997141, transparent); animation: ember 2.4s ease-in-out infinite; }
#darkveil-message { min-height: 3em; margin: 0; font: 13px/1.7 monospace; white-space: pre-line; overflow-wrap: anywhere; }
.hint { margin: 22px 0 0; color: #827667; font: 11px/1.6 monospace; }
button { margin-top: 26px; padding: 12px 24px; border: 1px solid #866644; background: #261711; color: #e2d1b0; font: 12px/1.2 monospace; letter-spacing: .16em; cursor: pointer; }
button:hover, button:focus-visible { background: #43291b; outline: 1px solid #c89e66; outline-offset: 3px; }
.has-error .loading-rule { animation: none; background: linear-gradient(90deg, transparent, #9e4234, transparent); }
.has-error .hint { display: none; }
noscript { position: fixed; inset: 0; display: grid; place-items: center; padding: 30px; background: #0a0908; }
@keyframes ember { 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .loading-rule { animation: none; } }

#darkveil-mouse-capture { position: fixed; inset: 0; z-index: 5; display: grid; place-items: center; background: #080706c9; }
.capture-panel { width: min(480px, 90vw); padding: 34px 40px; border: 1px solid #a68045; box-shadow: 0 0 0 5px #0e0c09, 0 20px 90px #000a; background: radial-gradient(ellipse at top, #302219, #100e0c 75%); text-align: center; }
.capture-title { margin: 0 0 16px; color: #eedcb8; font: 30px/1.2 Georgia, serif; }
.capture-message { margin: 0; color: #c6b697; font: 16px/1.55 system-ui, sans-serif; }
.capture-button { font: 17px/1.2 system-ui, sans-serif; letter-spacing: normal; }