/* Mnemoscheme: authoritative state and a readable, non-overlapping stop diagram. */
:root { --mn-border:#dce4ed; --mn-blue:#1769e0; --mn-text:#1d2939; --mn-muted:#5e6c80; }
body.mnemo-page { background:#eef2f7; min-height:100vh; height:auto; display:block; overflow-x:hidden; color:var(--mn-text); }
body.mnemo-page > header.mnemo-header { position:sticky!important; top:0!important; display:flex!important; flex-wrap:wrap!important; gap:12px!important; align-items:center!important; padding:10px 18px!important; min-height:70px!important; background:#fff!important; z-index:5000; }
body.mnemo-page .brand { display:flex; gap:9px; align-items:center; flex:0 0 auto; text-decoration:none; }
body.mnemo-page .brand-logo { height:36px; width:auto; border-radius:4px; }
body.mnemo-page .brand-text { display:flex;flex-direction:column; gap:2px; }
body.mnemo-page .brand-title { font-size:19px;letter-spacing:1px;font-weight:800;color:#145a9e; }
body.mnemo-page .brand-sub { font-size:10px;letter-spacing:1px;font-weight:650;color:#63778d; }
body.mnemo-page .mnemo-selector { display:flex; flex:1 1 360px; min-width:260px; align-items:center; gap:8px; flex-wrap:wrap; }
body.mnemo-page .mnemo-selector label { font-size:13px;font-weight:700;color:#526175; }
body.mnemo-page .mnemo-selector select { flex:1 1 180px; width:auto!important; min-width:145px; height:39px; padding:0 9px; border:1px solid #cbd5e1; background:#fff; border-radius:8px; font-size:13px; }
body.mnemo-page .mnemo-selector button { flex:0 0 auto; width:auto!important; padding:9px 13px; min-height:39px; border:1px solid #145dcc; background:#1769e0; border-radius:8px; color:white; font-size:13px; font-weight:700; cursor:pointer; }
body.mnemo-page .mnemo-selector button.secondary { background:#fff; color:#46566a; border-color:#cbd5e1; }
body.mnemo-page .mnemo-selector button:disabled { cursor:not-allowed; opacity:.45; }
body.mnemo-page .mnemo-selector button:focus-visible,body.mnemo-page select:focus-visible,body.mnemo-page .back-btn:focus-visible { outline:3px solid #7aaef9; outline-offset:2px; }
body.mnemo-page .back-btn { flex:0 0 auto; text-decoration:none; color:#344054; font-size:13px; font-weight:700; padding:9px 12px; border:1px solid #d7dfe8; background:#fff; border-radius:8px; white-space:nowrap; }
body.mnemo-page .selection-bar { display:flex; flex-wrap:wrap;gap:7px;align-items:center;padding:8px clamp(12px,2vw,28px);background:#e9eff7;border-bottom:1px solid #d9e2ec; }
body.mnemo-page .selection-bar[hidden] { display:none; }
body.mnemo-page .selection-bar > span { color:#526175;font-weight:700;font-size:12px; }
body.mnemo-page .selection-chip { width:auto!important; display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; padding:5px 10px; background:white; color:#245181; border:1px solid #c7d5e5; border-radius:999px; cursor:pointer; }
body.mnemo-page .selection-chip:focus-visible { outline:2px solid #1769e0; }
body.mnemo-page .main-content { display:flex;flex-direction:column; gap:17px;align-items:center;padding:20px clamp(12px,2vw,28px) 30px; width:100%; }
body.mnemo-page .empty-state { padding:30px; max-width:700px;width:100%;text-align:center;color:#58677a;background:#fff;border:1px dashed #b9c7d7;border-radius:12px; }
body.mnemo-page .mnemo-card { width:100%;max-width:1640px; border:1px solid var(--mn-border); background:#fff; box-shadow:0 5px 18px rgba(15,23,42,.055);border-radius:14px; overflow:hidden; }
body.mnemo-page .card-header { display:flex; justify-content:space-between;flex-wrap:wrap;align-items:flex-start;gap:14px;padding:15px 18px;border-bottom:1px solid #e6ebf1; background:#fafbfd; }
body.mnemo-page .card-heading { flex:1 1 370px; min-width:0; }
body.mnemo-page .card-title { font-size:16px;line-height:1.45;font-weight:800;overflow-wrap:anywhere; }
body.mnemo-page .card-subtitle { margin-top:4px;color:var(--mn-muted);font-size:12px;overflow-wrap:anywhere; }
body.mnemo-page .header-actions { display:flex; flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end; }
body.mnemo-page .status-badge,body.mnemo-page .movement-badge,body.mnemo-page .delay-badge { border-radius:8px;padding:7px 10px;font-size:12px;line-height:1.4;font-weight:750;background:#f1f5f9;color:#475569;border:1px solid #dce4ed;max-width:min(100%,430px);white-space:normal;overflow-wrap:anywhere; }
body.mnemo-page .movement-badge.forward { background:#f0fdf4;border-color:#bbefcc;color:#137a43; }
body.mnemo-page .movement-badge.backward,body.mnemo-page .status-badge.warning { background:#fff7ed;border-color:#fed7aa;color:#9a3412; }
body.mnemo-page .delay-badge.late { background:#fff1f2;border-color:#fecdd3;color:#9f1239; }
body.mnemo-page .delay-badge.early { background:#ecfdf5;border-color:#a7f3d0;color:#065f46; }
body.mnemo-page .center-btn { width:auto!important; cursor:pointer;border:1px solid #bed1e8;background:#fff;color:#28598a;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:700; }
body.mnemo-page .live-strip { display:flex; flex-wrap:wrap;gap:10px 18px; align-items:center; padding:9px 18px; background:#f8fafc; border-bottom:1px solid #e8edf3;color:#64748b;font-size:12px; }
body.mnemo-page .live-strip .online { color:#167447;font-weight:800; }
body.mnemo-page .live-strip .offline { color:#b42318;font-weight:800; }
body.mnemo-page .live-strip .finished { color:#344054;font-weight:800; }
body.mnemo-page .timeline-wrapper { width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;background:#f7f9fc; }
body.mnemo-page .timeline { position:relative;height:480px;min-width:660px; }
body.mnemo-page .track { position:absolute;top:230px;height:8px;left:110px;right:110px;border-radius:8px;background:#becadb;box-shadow:inset 0 1px 3px rgba(15,23,42,.12); }
body.mnemo-page .stop { position:absolute;top:234px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center; }
body.mnemo-page .stop-dot { display:block;width:18px;height:18px;margin-top:-9px;background:#fff;border:3px solid #5f86ad;border-radius:50%;box-shadow:0 0 0 3px #f7f9fc; }
body.mnemo-page .stop-line { position:absolute;top:10px;left:50%;width:1px;background:#c0cbd9; }
body.mnemo-page .stop.near .stop-line { height:40px; }
body.mnemo-page .stop.far .stop-line { height:124px; }
body.mnemo-page .stop-content { position:absolute;left:50%;width:164px;max-width:164px;display:flex; flex-direction:column;align-items:center;gap:4px;text-align:center;transform:translateX(-50%); }
body.mnemo-page .stop.near .stop-content { top:53px; }
body.mnemo-page .stop.far .stop-content { top:136px; }
body.mnemo-page .stop-label { font-size:12px; font-weight:700;color:#26364c;line-height:1.26; max-width:164px;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden; }
body.mnemo-page .stop-time { padding:3px 7px;border-radius:5px;background:#fff;border:1px solid #dbe3ec;color:#66768b;font-size:11px; white-space:nowrap; }
body.mnemo-page .marker { position:absolute;top:10px;display:flex;flex-direction:column;align-items:center;transform:translateX(-50%);z-index:8;pointer-events:none; }
body.mnemo-page .marker-plan { top:12px;z-index:8; }
body.mnemo-page .marker-fact { top:76px;z-index:9; }
body.mnemo-page .marker-badge { min-height:31px; min-width:92px; max-width:112px;padding:6px 9px;border-radius:9px;text-align:center;font-size:12px;font-weight:800;white-space:nowrap;box-shadow:0 3px 9px rgba(15,23,42,.10); }
body.mnemo-page .marker-plan .marker-badge { border:1px dashed #94a3b8;background:#fff;color:#64748b; }
body.mnemo-page .marker-fact .marker-badge { border:2px solid var(--mn-blue);background:#eef5ff;color:#125cc5; }
body.mnemo-page .marker-line { width:2px; }
body.mnemo-page .marker-plan .marker-line { height:176px;background:#94a3b8; }
body.mnemo-page .marker-fact .marker-line { height:112px;background:var(--mn-blue); }
body.mnemo-page .pointer-down { width:0;height:0;border:6px solid transparent;border-top:9px solid #94a3b8;border-bottom:0; }
body.mnemo-page .marker-fact .pointer-down { border-top-color:var(--mn-blue); }
body.mnemo-page .deviation-line { position:absolute;top:231px;height:6px;border-radius:6px;opacity:.75;z-index:1; }
body.mnemo-page .card-footer { display:flex; justify-content:space-between; gap:8px 18px;align-items:center;flex-wrap:wrap;padding:13px 18px;border-top:1px solid #e8edf3;background:#fff;color:#5b6a7c;font-size:12px; }
body.mnemo-page .footer-info { display:flex;flex-wrap:wrap;align-items:center;gap:9px 15px; }
body.mnemo-page .footer-info b { color:#1d2939; }
body.mnemo-page .footer-position { color:#536579;background:#f2f5f9;border:1px solid #e2e9f1;border-radius:7px;padding:7px 9px; }
body.mnemo-page .status-card { display:flex;align-items:flex-start; gap:16px;padding:27px 20px;min-height:150px; }
body.mnemo-page .status-icon { display:grid;place-items:center;flex:0 0 43px;width:43px;height:43px;border-radius:10px;color:#b42318;background:#fff1f2;font-weight:900;font-size:20px; }
body.mnemo-page .status-copy { flex:1;min-width:0; }
body.mnemo-page .status-title { font-weight:800;font-size:17px;margin-bottom:9px; }
body.mnemo-page .status-message { color:#586779;line-height:1.5;overflow-wrap:anywhere; }
body.mnemo-page .status-detail { margin-top:7px;color:#586779;font-size:12px; }
@media (max-width:900px) {
 body.mnemo-page > header.mnemo-header { padding:10px 12px!important; }
 body.mnemo-page .mnemo-selector { order:4;flex:1 1 100%;min-width:0; }
 body.mnemo-page .card-header { padding:12px; }
 body.mnemo-page .live-strip,body.mnemo-page .card-footer { padding:10px 12px; }
}
@media (max-width:520px) {
 body.mnemo-page .mnemo-selector { gap:7px; }
 body.mnemo-page .mnemo-selector label { flex:1 1 100%; }
 body.mnemo-page .mnemo-selector select { flex:1 1 100%; }
 body.mnemo-page .main-content { padding:10px 8px; }
 body.mnemo-page .card-title { font-size:14px; }
 body.mnemo-page .card-subtitle { font-size:12px; }
 body.mnemo-page .header-actions { justify-content:flex-start; }
}
/* The author display styles must not override HTML's hidden state. */
body.mnemo-page [hidden] { display:none!important; }
