/* Scheduled-update notices (Agent U, client/ui/maintenance.js). Field-journal materials from setpieces.css/journal.css:
   a pinned paper slip under the HUD, a folded tag while it waits, the "Saved" card, and the title's reconnect note. */
.mt-slip { position: fixed; top: 4.6rem; left: 50%; z-index: var(--z-toast, 70); pointer-events: none; color: var(--ink, #2b2118);
  transform: translate(-50%, -0.6rem) rotate(-0.6deg); opacity: 0; transition: opacity 260ms var(--ease-out), transform 360ms var(--ease-out); max-width: min(34rem, calc(100vw - 2rem)); }
.mt-slip.is-on { opacity: 1; transform: translate(-50%, 0) rotate(-0.6deg); }
.mt-slip::before, .mt-card__page::before, .mt-status::before { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: 3px;
  background: var(--fj-foxing), var(--grain), linear-gradient(176deg, var(--fj-paper, #efe2c2) 0%, #eadbb7 55%, var(--fj-paper-2, #e3d0a6) 100%);
  box-shadow: 0 0.45rem 0.9rem rgba(0, 0, 0, 0.42), 0 1px 1px rgba(0, 0, 0, 0.3); }
.mt-slip, .mt-card__page, .mt-status { isolation: isolate; }
/* folded: a small tag */
.mt-slip:not(.is-open) { padding: 0.32rem 0.8rem 0.32rem 0.6rem; font: 700 0.82rem/1.2 var(--font-ui); letter-spacing: 0.02em; color: var(--ink-soft, #5a4834); display: flex; align-items: center; gap: 0.4rem; white-space: nowrap; }
.mt-slip:not(.is-open) b { color: var(--ink, #2b2118); font-variant-numeric: tabular-nums; }
.mt-clock { width: 0.85rem; height: 0.85rem; border: 1.6px solid currentColor; border-radius: 50%; position: relative; display: inline-block; }
.mt-clock::after { content: ''; position: absolute; left: 50%; top: 18%; width: 1.4px; height: 38%; background: currentColor; transform-origin: bottom; animation: mt-hand 4s linear infinite; }
@keyframes mt-hand { to { transform: rotate(360deg); } }
/* open: the notice */
.mt-slip.is-open { padding: 0.75rem 1.2rem 0.8rem; width: 30rem; }
.mt-head { font-family: var(--font-display); font-weight: 900; font-size: var(--fs-2xs, 0.68rem); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-soft, #5a4834); margin-bottom: 0.25rem; }
.mt-head i { font-family: var(--font-hand); font-size: 1.05rem; letter-spacing: 0; text-transform: none; font-style: normal; color: var(--ink-blue, #2c4a63); font-weight: 600; }
.mt-main { margin: 0; font-family: var(--font-prose); font-size: 1.12rem; line-height: 1.3; color: var(--ink, #2b2118); }
.mt-time { font-family: var(--font-ui); font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ink-red, #a8321f); }
.mt-run { margin: 0.35rem 0 0; font-family: var(--font-prose); font-style: italic; font-size: 0.96rem; line-height: 1.25; color: var(--ink-blue, #2c4a63); }
.mt-sub { margin: 0.3rem 0 0; font: 600 0.78rem/1.25 var(--font-ui); color: var(--ink-soft, #5a4834); }
.mt-slip.is-final .mt-time { font-size: 1.3em; }
.mt-slip.is-final { animation: mt-nudge 1s var(--ease-inout) infinite alternate; }
@keyframes mt-nudge { from { transform: translate(-50%, 0) rotate(-0.6deg); } to { transform: translate(-50%, 2px) rotate(0.2deg); } }
.mt-pin { position: absolute; top: -0.35rem; left: 50%; width: 0.85rem; height: 0.85rem; margin-left: -0.42rem; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffe6c0, #c8442a 45%, #6e1a10); box-shadow: 0 3px 4px rgba(0, 0, 0, 0.45); z-index: 2; }
/* time's up: the "Saved" card over a dimmed world */
.mt-card { position: fixed; inset: 0; z-index: var(--z-screen, 100); display: grid; place-items: center; background: radial-gradient(ellipse at center, rgba(var(--chrome-rgb),0.55), rgba(var(--chrome-rgb),0.82)); animation: mt-in 320ms var(--ease-out); }
.mt-card.hidden { display: none; }
.mt-card__page { position: relative; padding: 1.4rem 1.8rem 1.5rem; width: min(26rem, calc(100vw - 2.5rem)); transform: rotate(-1deg); color: var(--ink, #2b2118); }
.mt-card__page .mt-main { font-size: 1.25rem; }
.mt-stamp { position: absolute; right: 1rem; bottom: -0.7rem; font-family: var(--font-print); letter-spacing: 0.12em; padding: 0.2em 0.6em; border: 2px solid currentColor; border-radius: 4px; color: var(--ink-green, #2f6b4a); transform: rotate(-8deg); background: rgba(239, 226, 194, 0.85); opacity: 0.9; }
@keyframes mt-in { from { opacity: 0; } }
/* the title while the server is down */
.mt-status { position: absolute; left: 50%; top: 1.2rem; transform: translateX(-50%) rotate(-0.8deg); z-index: 5; padding: 0.55rem 1.1rem; color: var(--ink, #2b2118);
  font: 600 1rem/1.2 var(--font-prose); white-space: nowrap; display: flex; align-items: baseline; gap: 0.35rem; }
.mt-status.hidden { display: none; }
.mt-status b { font-family: var(--font-hand); font-size: 1.35rem; color: var(--ink-red, #a8321f); }
.mt-status span { font-style: italic; color: var(--ink-soft, #5a4834); }
.mt-dots { display: inline-flex; gap: 3px; margin-left: 2px; }
.mt-dots i { width: 4px; height: 4px; border-radius: 50%; background: var(--ink-soft, #5a4834); animation: mt-dot 1.2s infinite ease-in-out; }
.mt-dots i:nth-child(2) { animation-delay: 0.2s; } .mt-dots i:nth-child(3) { animation-delay: 0.4s; }
@keyframes mt-dot { 0%, 80%, 100% { opacity: 0.25; } 40% { opacity: 1; } }
@media (max-width: 600px) { .mt-slip.is-open { width: auto; } .mt-status { white-space: normal; width: calc(100vw - 2rem); } }
@media (prefers-reduced-motion: reduce) { .mt-slip.is-final, .mt-clock::after, .mt-dots i { animation: none; } }