@charset "UTF-8";
/* Shared, self-contained presentation for maintenance and Apache error pages. */
:root {
    color-scheme: light;
    --paper: #fafbf8;
    --ink: #132e33;
    --petrol: #093e50;
    --teal: #087a91;
    --muted: #526970;
    --line: #d8e3e4;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: #edf3f3; }
body {
    isolation: isolate;
    min-height: 100vh;
    min-height: 100svh;
    margin: 0;
    padding: 100px 24px 28px;
    display: grid;
    align-content: center;
    justify-items: center;
    color: var(--ink);
    font: 400 16px/1.65 'Helvetica Neue', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
body::before {
    content: '';
    position: fixed;
    z-index: -2;
    inset: 58% 0 0;
    background: var(--petrol);
    clip-path: polygon(0 18%, 100% 0, 100% 100%, 0 100%);
}
.status-card {
    width: min(100%, 680px);
    padding: 0 48px 28px;
    text-align: center;
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: 30px;
    box-shadow: 0 20px 70px #052b3814;
}
.portrait { position: relative; width: 140px; height: 140px; margin: -63px auto 20px; }
.portrait::before {
    content: '';
    position: absolute;
    inset: -7px -9px 5px 3px;
    border: 1px solid #80bfc4;
    border-radius: 50%;
    z-index: -1;
}
.portrait img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 22%;
    background: #e2eff1;
    border: 4px solid var(--paper);
    border-radius: 50%;
}
p { margin: 0; }
.author-name { font-size: 1.35rem; line-height: 1.2; font-weight: 500; letter-spacing: -.035em; }
.author-name span { display: block; margin-top: 9px; color: var(--muted); font-size: .65rem; font-weight: 400; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow {
    display: inline-block;
    position: relative;
    isolation: isolate;
    margin: 31px 0 15px;
    color: var(--teal);
    font: 400 1.25rem/1.4 'Bradley Hand', 'Segoe Print', 'Comic Sans MS', cursive;
    transform: rotate(-1.4deg);
}
.eyebrow::before { content: ''; position: absolute; z-index: -1; inset: 53% -7px 1px; background: #d4e8eb; border-radius: 6px 3px 7px 4px; transform: skewX(-9deg) rotate(-1deg); }
h1 { margin: 0 0 23px; font-size: clamp(2.35rem, 5vw, 3.8rem); font-weight: 400; line-height: 1.04; letter-spacing: -.052em; text-wrap: balance; overflow-wrap: normal; }
.message { max-width: 46ch; margin-inline: auto; color: var(--muted); font-size: 1rem; }
.status-note { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; font-size: .76rem; color: var(--muted); }
.status-note span { width: 6px; height: 6px; flex: none; border-radius: 50%; background: var(--teal); }
.actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 24px 0 26px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 12px 24px; border: 1px solid var(--petrol); border-radius: 999px; background: var(--petrol); color: white; text-decoration: none; font-size: .875rem; font-weight: 500; transition: background .18s, color .18s; }
.button svg { flex: none; }
.button-secondary { background: transparent; color: var(--petrol); }
.button:hover { background: var(--teal); border-color: var(--teal); color: white; }
.button:focus-visible { outline: 3px solid var(--teal); outline-offset: 5px; }
.translation { padding-top: 22px; border-top: 1px solid var(--line); color: var(--muted); font-size: .83rem; line-height: 1.6; }
.closing { margin-top: 20px; color: var(--teal); font: 400 1.17rem/1.4 'Bradley Hand', 'Segoe Print', 'Comic Sans MS', cursive; transform: rotate(-1deg); }
footer { margin-top: 23px; color: #d2e7ea; font-size: .75rem; letter-spacing: .04em; }
::selection { color: var(--petrol); background: #b5e5e5; }
@media (max-width: 480px) {
    body { padding: 85px 18px 24px; }
    .status-card { padding: 0 23px 25px; border-radius: 25px; }
    .portrait { width: 120px; height: 120px; margin-top: -55px; margin-bottom: 15px; }
    .eyebrow { margin-top: 28px; font-size: 1.12rem; }
    .message { font-size: .94rem; }
    .desktop-break { display: none; }
    .actions { gap: 10px; }
    .button { padding-inline: 19px; }
}
@media (prefers-reduced-motion: reduce) { .button { transition: none; } }