html { background:var(--ink); min-height:100%; }
body { margin:0; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; position:relative; isolation:isolate; color:#ECE7DB; background:var(--ink); font-family:"Segoe UI",Arial,sans-serif; -webkit-user-select:none; user-select:none; overflow-x:hidden; }
body::before { content:""; position:fixed; inset:0; z-index:-1; background:radial-gradient(ellipse at 50% 42%,#102D3D 0%,#091F2D 40%,var(--ink) 78%); animation:background-in 1.4s ease both; }
.home-brand { display:flex; justify-content:center; align-items:center; gap:24px; padding:36px 24px 0; flex-shrink:0; color:var(--gold); animation:brand-in .85s ease .15s both; }
.home-brand::before,.home-brand::after { content:""; width:40px; height:1px; background:#B89B6050; }
.home-brand .brand-wordmark { font-size:25px; line-height:1.3; }
.container { flex:1 0 auto; display:flex; align-items:center; justify-content:center; width:100%; padding:48px 24px 54px; }
.container main { display:flex; flex-direction:column; align-items:center; max-width:100%; }
.container main::after { content:""; display:block; width:44px; height:1px; margin-top:30px; background:var(--gold); animation:line-in .8s ease 1.2s both; }
.crest { display:block; width:clamp(200px,23vw,310px); max-width:100%; height:auto; max-height:56svh; object-fit:contain; pointer-events:none; -webkit-touch-callout:none; filter:drop-shadow(0 18px 30px #00000035); animation:crest-in 1.2s cubic-bezier(.2,.7,.2,1) .4s both; }
footer { width:calc(100% - 104px); margin:0 auto; padding:22px 0 26px; border-top:1px solid #B89B6030; display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px 20px; flex-shrink:0; font-size:12px; line-height:1.8; color:#AAB5BA; animation:footer-in .8s ease .9s both; }
footer p { margin:0 auto 0 0; }
.animated-text { color:#D7C39A; font-weight:500; }
footer a { color:#C4CED0; text-decoration:none; animation:footer-in .65s ease 1.1s both; }
footer a:hover { color:#E9D4AB; text-decoration:underline; text-underline-offset:5px; }
.footer-separator { display:none; }
.devtools-modal,.devtools-lockout { position:fixed; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:32px; text-align:center; overflow:auto; overflow-wrap:anywhere; background:var(--ink); color:#ECE7DB; }
.devtools-modal { z-index:9999; }
.devtools-modal-heading { font:400 32px/1.25 Georgia,serif; color:var(--gold); }
.devtools-modal p { max-width:580px; line-height:1.8; }
.devtools-lockout { z-index:10000; font:400 clamp(22px,4vw,36px)/1.4 Georgia,serif; }
@keyframes background-in { from { opacity:0; } to { opacity:1; } }
@keyframes brand-in { from { opacity:0; transform:translateY(-12px); } to { opacity:1; transform:translateY(0); } }
@keyframes crest-in { from { opacity:0; transform:translateY(-28px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes line-in { from { opacity:0; transform:scaleX(0); } to { opacity:.55; transform:scaleX(1); } }
@keyframes footer-in { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:700px) { .home-brand { padding-top:28px; gap:16px; } .home-brand .brand-wordmark { font-size:23px; } .container { padding:32px 22px; } footer { width:calc(100% - 40px); gap:7px 16px; font-size:11px; } footer p { flex-basis:100%; text-align:center; margin:0; } }
@media(max-height:520px) and (orientation:landscape) { .home-brand { padding-top:16px; } .container { padding:18px; } .crest { max-height:45svh; } .container main::after { margin-top:16px; } footer { padding:12px 0; } }
@media(prefers-reduced-motion:reduce) { body::before,.home-brand,.crest,.container main::after,footer,footer a { animation:none; } .container main::after { opacity:.55; } }