@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');

:root {
  color-scheme: dark;
  --ink: #e9eee4;
  --muted: #a7afa1;
  --faint: #798579;
  --deep: #101b15;
  --forest: #1c2c20;
  --moss: #adc587;
  --lime: #d2e4a0;
  --gold: #d9bc80;
  --orange: #e3966b;
  --line: rgba(237, 239, 221, .12);
  --card: rgba(23, 34, 25, .88);
  font-family: 'DM Sans', sans-serif;
}
* { box-sizing: border-box; }
html { min-width: 320px; min-height: 100%; scroll-behavior: smooth; scroll-padding-top: 72px; }
body { min-width: 320px; min-height: 100vh; margin: 0; background: var(--deep); color: var(--ink); }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
button, a { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
.journey-screen { position: relative; display: none; min-height: 100svh; overflow: hidden; }
.journey-screen.is-visible { display: block; animation: screen-enter .56s ease both; }
.entry-screen { display: none; isolation: isolate; background: #101b15; }
.entry-backdrop { position: absolute; z-index: -2; inset: 0; background: url('https://upload.wikimedia.org/wikipedia/commons/f/f5/A_view_of_Udaipur_Aravalli_Hills_Rajasthan_India.jpg') center 54%/cover no-repeat; animation: landscape-arrive 28s ease-in-out infinite alternate; }
.entry-screen::before { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(10, 19, 14, .91) 0%, rgba(13, 21, 15, .79) 36%, rgba(12, 19, 13, .35) 70%, rgba(14, 20, 14, .18) 100%), linear-gradient(0deg, rgba(6, 11, 8, .8) 0%, transparent 31%, rgba(7, 13, 9, .29) 100%); content: ''; }
.entry-header { position: absolute; top: 0; right: 0; left: 0; display: flex; align-items: center; justify-content: space-between; padding: 27px clamp(22px, 5.4vw, 86px); }
.identity { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); text-decoration: none; }
.identity-mark { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(221, 235, 186, .39); border-radius: 50%; background: rgba(16, 30, 19, .49); }
.identity-mark svg { width: 26px; fill: none; stroke: var(--lime); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.identity strong { display: block; font: 700 19px Manrope, sans-serif; letter-spacing: -.8px; }.identity strong span { color: var(--lime); }
.identity small { display: block; margin-top: 3px; color: rgba(220, 230, 210, .68); font-size: 8px; font-weight: 600; letter-spacing: 1.55px; }
.entry-meta { display: flex; align-items: center; gap: 9px; color: #d5dbca; font-size: 8px; font-weight: 600; letter-spacing: .8px; text-align: right; }
.entry-meta small { display: block; margin-top: 5px; color: rgba(224, 228, 209, .63); font-size: 8px; font-weight: 400; letter-spacing: .15px; }
.authority-seal { display: grid; width: 25px; height: 25px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(230, 208, 154, .46); border-radius: 50%; color: #e5cf9e; font-size: 13px; }
.entry-copy { position: relative; z-index: 1; display: flex; width: min(720px, 85vw); min-height: 100svh; flex-direction: column; justify-content: center; padding: 98px clamp(22px, 10.7vw, 170px) 88px; }
.hero-kicker, .micro-label { color: var(--lime); font-size: 9px; font-weight: 700; letter-spacing: 1.55px; }
.hero-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 19px; }
.hero-rule { width: 27px; height: 1px; background: var(--lime); }
.entry-copy h1, .landscape-copy h1 { margin: 0; font: 500 clamp(48px, 7vw, 89px)/1.04 'Playfair Display', Georgia, serif; letter-spacing: -2.4px; }
.entry-copy h1 em, .landscape-copy h1 em { color: var(--lime); font-weight: 500; }
.entry-copy > p { margin-top: 19px; color: rgba(231, 235, 220, .8); font: 400 14px/1.7 'DM Sans', sans-serif; letter-spacing: .13px; }
.entry-cta { display: flex; width: fit-content; min-width: 257px; align-items: center; gap: 13px; margin-top: 33px; padding: 12px 20px 12px 12px; border: 1px solid rgba(226, 234, 200, .64); border-radius: 40px; background: rgba(226, 232, 210, .95); color: #263724; text-align: left; cursor: pointer; transition: transform .22s, background .22s, box-shadow .22s; box-shadow: 0 13px 40px rgba(0, 0, 0, .16); }
.entry-cta:hover { transform: translateY(-3px); background: #f1f4e5; box-shadow: 0 14px 36px rgba(0, 0, 0, .27); }
.cta-seal { display: grid; width: 39px; height: 39px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #3e6246; }
.cta-seal svg { width: 26px; fill: none; stroke: #d9e9ba; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
.entry-cta strong, .entry-cta small { display: block; }.entry-cta strong { font: 700 12px Manrope, sans-serif; }.entry-cta small { margin-top: 3px; color: #60705c; font-size: 9px; }.entry-cta small b { margin-left: 5px; font-size: 12px; }
.entry-note { display: flex; align-items: center; gap: 12px; margin-top: 59px; color: rgba(230, 234, 213, .69); font-size: 8px; font-weight: 600; letter-spacing: 1px; }
.scroll-mark { display: grid; width: 23px; height: 23px; place-items: center; border: 1px solid rgba(228, 235, 205, .42); border-radius: 50%; color: var(--lime); font-size: 11px; }
.entry-note > span:last-child { margin-left: 9px; }.entry-note i { color: var(--lime); font-style: normal; }
.entry-caption { position: absolute; right: 32px; bottom: 20px; display: flex; align-items: center; gap: 8px; color: rgba(228, 231, 217, .74); font-size: 7px; letter-spacing: .8px; }
.entry-caption a { color: rgba(230, 235, 216, .78); text-decoration-color: rgba(230, 235, 216, .35); text-underline-offset: 3px; }.caption-dot, .live-pip { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 12px rgba(210, 228, 160, .4); }
.entry-vertical { position: absolute; top: 50%; right: 22px; color: rgba(238, 235, 218, .62); font-size: 7px; font-weight: 600; letter-spacing: 1.3px; transform: translateY(-50%) rotate(90deg); transform-origin: right; }
.journey-topbar { position: relative; z-index: 3; display: flex; height: 74px; align-items: center; justify-content: space-between; padding: 0 clamp(18px, 4vw, 61px); border-bottom: 1px solid var(--line); background: rgba(16, 27, 21, .92); }
.identity-small .identity-mark { width: 34px; height: 34px; }.identity-small .identity-mark svg { width: 21px; }.identity-small strong { font-size: 15px; }.identity-small small { font-size: 7px; }
.journey-progress { display: flex; align-items: center; gap: 13px; color: #718073; font-size: 8px; font-weight: 700; letter-spacing: .75px; }
.journey-progress b { width: 26px; height: 1px; background: rgba(224, 230, 210, .16); }.journey-progress i { font-style: normal; color: #839187; }.journey-progress .progress-active { color: #a9c184; }.journey-progress .progress-current { color: var(--lime); }
.text-button { border: 0; background: none; color: #9aa594; font-size: 9px; cursor: pointer; }.text-button:hover { color: var(--lime); }
.landscape-screen { background: radial-gradient(ellipse at 70% 20%, rgba(56, 82, 49, .24), transparent 47%), #101a14; }
.landscape-content { display: grid; width: min(1390px, calc(100% - 2 * clamp(20px, 5.5vw, 84px))); grid-template-columns: .77fr 1.23fr; align-items: center; gap: clamp(36px, 7vw, 104px); margin: 0 auto; padding: clamp(38px, 6.4vh, 65px) 0 39px; }
.landscape-copy { padding-left: clamp(0px, 1vw, 15px); }.landscape-copy .hero-kicker { margin-bottom: 14px; font-size: 8px; }
.landscape-copy h1 { font-size: clamp(38px, 4.5vw, 58px); letter-spacing: -1.5px; }.landscape-copy h1 em { color: #c6d99f; }
.landscape-lede { max-width: 405px; margin-top: 14px; color: #a9b1a1; font-size: 11px; line-height: 1.8; }
.landscape-fact { display: grid; grid-template-columns: 27px 1fr; gap: 10px; max-width: 400px; margin-top: 17px; padding-top: 12px; border-top: 1px solid var(--line); }
.fact-index { padding-top: 2px; color: #b1c78c; font: 500 11px 'Playfair Display', serif; }.landscape-fact strong { font: 600 11px Manrope,sans-serif; }.landscape-fact p { margin-top: 4px; color: #8e9a8d; font-size: 9px; line-height: 1.6; }
.button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; gap: 9px; padding: 0 16px; border: 1px solid transparent; border-radius: 6px; font-size: 10px; font-weight: 700; cursor: pointer; transition: transform .18s, background .18s; }.button:hover { transform: translateY(-2px); }
.button-light { margin-top: 21px; background: #d3e2ad; color: #223320; }.button-light:hover { background: #e4edcd; }.button-secondary { border-color: rgba(201, 218, 187, .19); background: rgba(255,255,255,.04); color: #d0dbc6; }.button-secondary:hover { background: rgba(255,255,255,.085); }.button-primary { background: #cddd9d; color: #29351f; }.button-primary:hover { background: #e2ebbd; }.location-correction { max-width: 440px; margin-top: 15px; color: #828d80; font-size: 8px; line-height: 1.6; }
.film-frame { min-width: 0; }.film-media { position: relative; min-height: 450px; height: min(61vh, 580px); overflow: hidden; border: 1px solid rgba(223, 232, 199, .19); background: #1a271d; box-shadow: 0 24px 80px rgba(0, 0, 0, .24); }
.film-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.03); transition: opacity 1.1s, transform 7s ease; }.film-image.is-active { opacity: 1; transform: scale(1.15); }
.film-image:nth-child(2) { object-position: center 44%; }.film-wash { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(7,13,8,.22),transparent 25%,transparent 55%,rgba(7,13,8,.27)); pointer-events: none; }
.film-title { position: absolute; top: clamp(18px,4vh,38px); right: 18px; left: 18px; display: grid; justify-items: center; color: #fffdf1; text-align: center; pointer-events: none; }.film-title > span { color: #f0e7c6; font-size: 7px; font-weight: 700; letter-spacing: 1.6px; text-shadow: 0 2px 13px rgba(0,0,0,.74); }.film-title h2 { margin-top: 8px; font: 500 clamp(26px,4vw,46px)/1.06 'Playfair Display',Georgia,serif; letter-spacing: -.5px; text-shadow: 0 2px 18px rgba(0,0,0,.8),0 1px 3px rgba(0,0,0,.72); }.film-title h2 em { color: #eff0d4; font-weight: 500; }.film-title small { margin-top: 8px; color: #fff9e7; font-size: 7px; letter-spacing: .35px; text-shadow: 0 1px 12px rgba(0,0,0,.9); }
.rec-dot { width: 6px; height: 6px; border-radius: 50%; background: #d17e5a; box-shadow: 0 0 9px rgba(226, 126, 91, .59); }
.film-story-caption { position: absolute; right: clamp(15px,4vw,43px); bottom: 119px; left: clamp(15px,4vw,43px); max-width: 690px; padding: 0; border: 0; background: transparent; color: #fffdf0; text-shadow: 0 2px 16px rgba(0,0,0,.95),0 1px 3px rgba(0,0,0,.88); }.film-story-caption > span { color: #f0e6bd; font-size: 7px; font-weight: 700; letter-spacing: 1.2px; text-shadow: 0 1px 12px rgba(0,0,0,.98); }.film-story-caption p { max-width: 680px; margin-top: 7px; font: 500 clamp(11px,1.2vw,14px)/1.65 'Playfair Display',Georgia,serif; text-wrap: pretty; }
.film-caption { position: absolute; right: 20px; bottom: 84px; left: 21px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; color: #f1eedb; font-size: 8px; font-weight: 700; letter-spacing: 1px; }.film-caption small { color: rgba(235, 233, 211, .72); font-size: 8px; font-weight: 400; letter-spacing: 0; }
.film-controls { position: absolute; right: 14px; bottom: 13px; left: 14px; display: flex; align-items: center; gap: 9px; }.film-controls > button { display: grid; min-width: 29px; height: 29px; place-items: center; padding: 0 7px; border: 1px solid rgba(243, 238, 213, .37); border-radius: 30px; background: rgba(10,16,11,.3); color: white; cursor: pointer; }.film-controls > button:hover { background: rgba(242,238,218,.17); }.film-controls .film-play { min-width: 112px; height: 32px; margin-left: auto; border-color: rgba(222,235,194,.48); background: rgba(211,226,173,.95); color: #253421; font-size: 8px; font-weight: 700; }.film-controls .film-play:hover { background: #ecf2d9; }.film-language select { max-width: 76px; height: 28px; padding: 0 6px; border: 1px solid rgba(243,238,213,.25); border-radius: 4px; background: rgba(10,16,11,.38); color: #f0eedc; font-size: 7px; }.film-elapsed { color: #f2efde; font: 7px ui-monospace,monospace; white-space: nowrap; }
.film-progress { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: rgba(247,243,220,.2); }.film-progress > span { display: block; width: 0; height: 100%; background: #dbe8ae; box-shadow: 0 0 9px rgba(219,232,174,.6); transition: width .4s linear; }
.film-media:has(.film-play[aria-pressed=true]) .film-image.is-active { animation: film-pan 30s linear forwards; }
.film-dots { display: flex; gap: 5px; }.film-dots button { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 5px; background: rgba(244,240,218,.43); cursor: pointer; transition: width .2s, background .2s; }.film-dots button.is-active { width: 20px; background: #e7e7ce; }
.film-credit-line { display: flex; justify-content: space-between; gap: 10px; padding-top: 9px; color: #778476; font-size: 7px; font-weight: 600; letter-spacing: .65px; }.film-credit-line a { color: #a4b58d; text-decoration: none; letter-spacing: .1px; }.film-credit-line a:hover { text-decoration: underline; }
.story-rail { display: grid; grid-template-columns: repeat(4,1fr); width: min(1390px, calc(100% - 2 * clamp(20px, 5.5vw, 84px))); margin: 0 auto; border-top: 1px solid var(--line); }
.story-rail button { display: flex; align-items: center; gap: 10px; padding: 13px 13px 16px 0; border: 0; background: transparent; color: #d2dbcc; text-align: left; cursor: pointer; }.story-rail button + button { padding-left: 14px; border-left: 1px solid var(--line); }.story-rail button span { color: #94a579; font-size: 8px; }.story-rail button b { flex: 1; font-size: 9px; font-weight: 500; }.story-rail button i { color: #92a680; font-size: 11px; font-style: normal; transition: transform .2s; }.story-rail button:hover i { transform: translateX(4px); }
.guardian-screen { min-height: 100vh; background: radial-gradient(ellipse at 74% 1%, rgba(55, 85, 54, .17), transparent 36%), #111a15; }
.side-rail { position: fixed; z-index: 1000; top: 0; bottom: 0; left: 0; display: flex; width: 238px; flex-direction: column; padding: 20px 15px 15px; border-right: 1px solid rgba(220, 232, 208, .085); background: linear-gradient(180deg, rgba(18,29,22,.98), rgba(15,25,19,.98)); }
.rail-identity { padding: 0 7px 19px; }.rail-location { display: grid; gap: 5px; padding: 13px 10px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.rail-label { color: #829081; font-size: 7px; font-weight: 700; letter-spacing: 1.1px; }.rail-location strong { font: 600 11px Manrope,sans-serif; }.rail-location small { color: #9ca693; font-size: 8px; }
.rail-heading { margin: 18px 10px 8px; }.rail-nav { display: grid; gap: 3px; }
.rail-nav button, .rail-back { display: flex; min-height: 34px; align-items: center; gap: 9px; padding: 0 10px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #9faa9a; font-size: 9px; text-align: left; cursor: pointer; }.rail-nav button > span { width: 16px; color: #acbd97; font-size: 14px; text-align: center; }.rail-nav button:hover, .rail-nav button.active { border-color: rgba(191, 216, 160, .08); background: rgba(166, 193, 128, .09); color: #dbe6cd; }.rail-nav button > i { margin-left: auto; color: #8d9c86; font-size: 8px; font-style: normal; }.rail-count { display: grid; min-width: 18px; height: 18px; place-items: center; margin-left: auto; border-radius: 50%; background: rgba(207, 155, 105, .14); color: #dcad81; font-size: 8px; }
.rail-spacer { flex: 1; }.authority-notice { display: flex; align-items: flex-start; gap: 9px; padding: 11px 9px; border: 1px solid rgba(226, 191, 124, .14); background: rgba(190, 151, 85, .055); }.authority-notice .authority-seal { width: 21px; height: 21px; font-size: 10px; }.authority-notice strong, .authority-notice small { display: block; }.authority-notice strong { color: #d6c59c; font-size: 8px; }.authority-notice small { margin-top: 4px; color: #a59b82; font-size: 7px; line-height: 1.4; }
.rail-back { justify-content: center; margin-top: 9px; border-color: var(--line); }
.guardian-main { min-width: 0; margin-left: 238px; }.console-header { position: sticky; z-index: 800; top: 0; display: flex; min-height: 71px; align-items: center; justify-content: space-between; gap: 20px; padding: 11px clamp(18px, 3vw, 42px); border-bottom: 1px solid rgba(220, 232, 208, .09); background: rgba(16, 25, 19, .93); backdrop-filter: blur(16px); }
.console-heading .eyebrow { display: flex; align-items: center; gap: 7px; margin: 0 0 5px; color: #91a781; font-size: 7px; font-weight: 700; letter-spacing: 1px; }.console-heading .eyebrow i { color: #657363; font-style: normal; }.console-heading h1 { margin: 0; font: 600 14px Manrope,sans-serif; letter-spacing: -.2px; }
.header-right { display: flex; align-items: center; gap: 17px; }.honest-mode { display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid rgba(226, 191, 124, .16); color: #dbbf8a; font-size: 7px; font-weight: 700; letter-spacing: .55px; white-space: nowrap; }.honest-mode i { width: 5px; height: 5px; border-radius: 50%; background: #d7b669; }.local-time { color: #8d9989; font-size: 8px; white-space: nowrap; }.menu-button { display: none; }
.console-content { width: min(1440px, 100%); margin: 0 auto; padding: 19px clamp(14px, 2.6vw, 38px) 14px; }
.integrity-banner { display: flex; min-height: 46px; align-items: center; gap: 10px; margin-bottom: 11px; padding: 8px 12px; border: 1px solid rgba(222, 188, 127, .14); background: rgba(166, 127, 66, .065); }.integrity-banner > span { display: grid; width: 17px; height: 17px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(227, 198, 142, .5); border-radius: 50%; color: #e5c992; font: 700 10px Georgia; }.integrity-banner p { flex: 1; color: #a9a794; font-size: 8px; line-height: 1.5; }.integrity-banner p strong { margin-right: 5px; color: #e3cf9e; }.integrity-banner p b { color: #e8bb89; font-weight: 600; }.integrity-banner > a { color: #b5c092; font-size: 7px; white-space: nowrap; }
.live-context { display: grid; grid-template-columns: minmax(235px,1.6fr) repeat(3,minmax(72px,.55fr)) auto; align-items: center; gap: 14px; margin-bottom: 12px; padding: 11px 14px; border: 1px solid rgba(175, 209, 157, .14); background: linear-gradient(100deg, rgba(38, 57, 38, .58), rgba(22, 36, 28, .77)); }
.context-location { display: flex; min-width: 0; align-items: center; gap: 10px; }.sun-glyph { display: grid; width: 33px; height: 33px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(213, 219, 156, .2); border-radius: 50%; color: #d7d196; font-size: 17px; }.context-location > div { display: grid; min-width: 0; gap: 3px; }.context-location .micro-label { color: #96ad83; font-size: 6px; }.context-location strong { overflow: hidden; color: #d5dfcf; font-size: 9px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }.context-location small { overflow: hidden; color: #94a190; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.context-value { display: grid; gap: 4px; padding-left: 12px; border-left: 1px solid var(--line); }.context-value strong { color: #e0e5d3; font: 600 16px Manrope,sans-serif; }.context-value small { color: #8b9887; font-size: 6px; letter-spacing: .6px; }.weather-credit { color: #a7bd91; font-size: 7px; white-space: nowrap; }
.monitor-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(240px, .8fr); gap: 11px; margin-bottom: 11px; }
.panel { min-width: 0; border: 1px solid rgba(220, 232, 208, .1); background: linear-gradient(145deg, rgba(25,37,28,.96), rgba(18,29,22,.96)); box-shadow: 0 12px 34px rgba(0,0,0,.09); }.map-panel { overflow: hidden; }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 14px 15px 11px; }.panel-heading .micro-label, .micro-label { color: #92a47f; font-size: 7px; letter-spacing: 1px; }.panel-heading h2 { margin: 4px 0 0; font: 600 14px Manrope,sans-serif; letter-spacing: -.35px; }.panel-heading p { margin-top: 5px; color: #919d8e; font-size: 8px; line-height: 1.5; }
.map-mode { padding: 7px 9px; border: 1px solid rgba(201, 222, 191, .16); background: rgba(255,255,255,.025); color: #d3dfc6; font-size: 7px; white-space: nowrap; cursor: pointer; }.map-mode:hover { background: rgba(255,255,255,.075); }
.map-stage { position: relative; height: clamp(265px, 32vh, 370px); margin: 0 10px; border: 1px solid rgba(211, 229, 190, .12); background: #19251c; }.map-stage #map { width: 100%; height: 100%; }.leaflet-container { background: #1a271e; font-family: 'DM Sans',sans-serif; }.leaflet-control-zoom a { border-color: rgba(215,231,205,.13)!important; background: #19281f!important; color: #dbe5d4!important; }.leaflet-control-layers { border: 1px solid rgba(225,237,210,.17)!important; border-radius: 4px!important; background: rgba(16,26,19,.93)!important; color: #e3ead8!important; font-size: 9px!important; }.leaflet-control-layers label { color: #e3ead8!important; }.leaflet-control-attribution { background: rgba(10,18,13,.8)!important; color: #c9d2c4!important; font-size: 7px!important; }.leaflet-control-attribution a { color: #bfd49e!important; }.leaflet-popup-content-wrapper, .leaflet-popup-tip { background: #1b2b20; color: #e5eadf; }
.map-overlay { position: absolute; z-index: 450; bottom: 31px; left: 9px; display: flex; align-items: center; gap: 6px; padding: 7px; background: rgba(15,24,18,.89); color: #dae1d5; font-size: 6px; }.key-dot { width: 6px; height: 6px; margin-left: 5px; border-radius: 50%; }.key-zone { background: #c9d99f; }.key-point { background: #92c5a3; }.key-alert { background: #e69874; }.map-mapnote { position: absolute; z-index: 450; right: 7px; bottom: 7px; max-width: 46%; padding: 5px; background: rgba(14,22,16,.87); color: #bac3b4; font-size: 6px; text-align: right; }
.map-bottom { display: flex; min-height: 37px; align-items: center; gap: 7px; padding: 5px 14px; }.map-bottom > span { flex: 1; color: #93a18e; font: 7px ui-monospace,monospace; }.map-search { display: flex; flex: 0 1 185px; gap: 4px; }.map-search input { width: 100%; min-width: 0; height: 26px; padding: 4px 7px; border: 1px solid rgba(209,223,193,.1); border-radius: 3px; background: rgba(255,255,255,.025); color: #dbe4d5; font-size: 7px; }.map-search input::placeholder { color: #81907d; }.quiet-action { padding: 5px 7px; border: 1px solid rgba(209, 223, 193, .1); background: transparent; color: #c4d0be; font-size: 7px; cursor: pointer; }.quiet-action:hover { border-color: rgba(208, 225, 190, .32); color: #eff2df; }
.camera-panel { margin-bottom: 11px; }.camera-workspace { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(210px,.8fr); gap: 13px; padding: 0 14px 14px; }.camera-preview { position: relative; display: grid; min-height: 170px; max-height: 290px; place-items: center; overflow: hidden; border: 1px solid rgba(211,229,190,.12); background: radial-gradient(ellipse at 50% 0%,rgba(76,96,68,.17),transparent 60%),#111c15; }.camera-preview img,.camera-preview video { position: absolute; width: 100%; height: 100%; object-fit: contain; }.camera-placeholder { display: grid; justify-items: center; gap: 7px; color: #9baa91; text-align: center; }.camera-placeholder > span { display: grid; width: 37px; height: 37px; place-items: center; border: 1px solid rgba(186,211,157,.19); border-radius: 50%; color: #c6d69e; font-size: 20px; }.camera-placeholder strong { color: #c7d2bd; font-size: 9px; }.camera-placeholder small { color: #8a9684; font-size: 7px; }.camera-actions { display: flex; flex-direction: column; align-items: stretch; gap: 7px; }.camera-actions .button { min-height: 33px; font-size: 8px; }.camera-actions #media-result { min-height: 29px; padding: 8px; border-left: 2px solid rgba(188,211,153,.35); background: rgba(255,255,255,.025); color: #aab5a2; font-size: 7px; line-height: 1.5; }.camera-actions > small { color: #879381; font-size: 7px; line-height: 1.5; }.upload-button { position: relative; overflow: hidden; }.upload-button input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.zone-marker { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(213, 231, 183, .7); border-radius: 50%; background: rgba(65,105,67,.91); color: white; box-shadow: 0 0 0 4px rgba(174,209,132,.15); }.risk-marker { width: 16px; height: 16px; border: 2px solid #ffe6bc; border-radius: 50%; background: #d8815d; box-shadow: 0 0 0 6px rgba(219,129,90,.17),0 0 19px rgba(226,145,99,.37); }.risk-marker.simulated { animation: marker-pulse 1.4s infinite; }.zone-chip { display: inline-flex; gap: 7px; align-items: center; padding: 6px 8px; border: 1px solid var(--line); background: rgba(255,255,255,.02); color: #c1ceba; font-size: 7px; }.zone-chip i { width: 5px; height: 5px; border-radius: 50%; background: #bad08d; }.zone-chip small { color: #849181; font-size: 6px; }
.story-card { display: flex; flex-direction: column; padding: 16px; }.story-card-header { display: flex; justify-content: space-between; gap: 8px; }.story-card-header .micro-label { color: #9aaf86; font-size: 7px; }.story-card-header h2 { margin-top: 7px; font: 600 25px/1.12 'Playfair Display',Georgia,serif; }.story-card-header h2 em { color: #cbda9b; }.leaf-emblem { color: #c2d49d; font-size: 23px; }
.story-card-copy { margin-top: 12px; color: #9da897; font-size: 9px; line-height: 1.7; }.species-label { margin-top: 17px; padding-top: 12px; border-top: 1px solid var(--line); color: #98a884; font-size: 6px; font-weight: 700; letter-spacing: .65px; line-height: 1.5; }.species-label i { display: block; margin-top: 3px; color: #c3a978; font-size: 7px; font-weight: 400; letter-spacing: 0; }
.species-list { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }.species-list span { padding: 5px 7px; border: 1px solid rgba(189,210,155,.15); border-radius: 20px; background: rgba(170,196,132,.055); color: #cbd7c3; font: 500 8px 'Playfair Display',serif; }
.story-link { display: flex; justify-content: space-between; width: 100%; margin-top: auto; padding: 13px 0 0; border: 0; border-top: 1px solid var(--line); background: none; color: #ced9b7; font-size: 8px; text-align: left; cursor: pointer; }.story-link span { color: #bdd395; }.citation-line { margin-top: 9px; color: #798577; font-size: 6px; line-height: 1.5; }
.control-deck { display: grid; grid-template-columns: minmax(180px,1fr) minmax(165px,.8fr) auto auto auto; align-items: center; gap: 9px; margin-bottom: 11px; padding: 11px 13px; border: 1px solid rgba(182,211,151,.15); background: linear-gradient(100deg, rgba(32,51,35,.88), rgba(24,37,28,.92)); }
.control-intro { display: grid; gap: 4px; }.control-intro .micro-label { font-size: 6px; letter-spacing: .85px; }.control-intro strong { font: 600 10px Manrope,sans-serif; }.control-intro strong em { color: #e0bf8b; font-size: 8px; font-style: normal; }.control-intro small { color: #8f9b8b; font-size: 7px; }
.scenario-field { display: grid; gap: 4px; color: #99a691; font-size: 7px; }.scenario-field select, .filter-field select { height: 32px; min-width: 0; padding: 0 8px; border: 1px solid rgba(216,228,204,.13); border-radius: 4px; background: #1a281e; color: #dce3d4; font-size: 8px; }.control-deck .button { min-height: 33px; padding: 0 10px; font-size: 8px; white-space: nowrap; }.sound-control { display: grid; grid-template-columns: 20px auto; gap: 1px 5px; align-items: center; padding: 5px 7px; border: 1px solid rgba(219,227,205,.13); background: rgba(255,255,255,.025); text-align: left; cursor: pointer; }.sound-control > span { grid-row: span 2; color: #d0d8b1; font-size: 14px; }.sound-control b { color: #d9e2d0; font-size: 7px; }.sound-control small { color: #889484; font-size: 6px; }.sound-control[aria-pressed=true] { border-color: rgba(223,194,130,.38); }.demo-run-status { display: flex; min-height: 13px; align-items: center; gap: 6px; grid-column: 1/-1; color: #9da990; font-size: 7px; letter-spacing: .35px; }.demo-status-dot { width: 5px; height: 5px; border-radius: 50%; background: #92a088; }.demo-run-status.is-running .demo-status-dot { background: #badc8c; box-shadow: 0 0 0 4px rgba(175,216,132,.12); animation: dot-pulse 1.5s infinite; }.demo-run-status.is-running { color: #d4e1bb; }
.alert-panel { margin-bottom: 11px; }.alert-heading { align-items: center; }.alert-heading h2 { display: flex; align-items: center; gap: 8px; }.alert-heading h2 b { display: grid; width: 17px; height: 17px; place-items: center; border: 1px solid rgba(211,171,119,.18); border-radius: 50%; color: #dfb681; font: 500 8px Manrope; }.filter-field { display: grid; gap: 4px; color: #879482; font-size: 7px; }.filter-field select { min-width: 108px; height: 28px; }
.event-list { display: grid; }.event-row { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 9px 14px; border-top: 1px solid rgba(220,232,208,.075); }.event-icon { display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid rgba(215,174,125,.14); border-radius: 6px; background: rgba(209,150,91,.075); color: #d7b485; }.event-main strong { color: #dae3d4; font-size: 8px; font-weight: 600; line-height: 1.4; }.event-main p { margin-top: 3px; color: #929e8e; font-size: 7px; line-height: 1.45; }.event-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; color: #788575; font-size: 6px; }.event-actions { display: flex; align-items: center; gap: 5px; }.event-actions button { padding: 5px 7px; border: 1px solid rgba(222,230,211,.12); background: transparent; color: #bdc9b5; font-size: 7px; cursor: pointer; }.event-actions button.verify { border-color: rgba(180,212,151,.18); color: #c4d69c; }.status-tag { padding: 5px 6px; background: rgba(217,177,115,.075); color: #d8b980; font-size: 6px; white-space: nowrap; }.status-verified { background: rgba(152,200,137,.09); color: #bed59b; }.status-dismissed { background: rgba(189,196,178,.07); color: #aab3a4; }.empty-events { padding: 20px; color: #95a08f; font-size: 8px; text-align: center; }
.authority-panel { display: grid; grid-template-columns: minmax(220px,.74fr) minmax(0,1.26fr); gap: clamp(18px,4vw,51px); margin-bottom: 13px; padding: clamp(16px,2.4vw,27px); border: 1px solid rgba(226,205,159,.14); background: radial-gradient(ellipse at 8% 19%, rgba(104,111,67,.14),transparent 52%),linear-gradient(130deg,rgba(39,43,29,.93),rgba(25,32,24,.96)); }
.authority-intro > .micro-label { display: block; margin-top: 11px; color: #c1aa7f; }.authority-symbol { color: #dcc795; font-size: 24px; }.authority-intro h2 { margin-top: 10px; font: 500 clamp(23px,3vw,32px)/1.15 'Playfair Display',Georgia,serif; }.authority-intro h2 em { color: #d5d9ae; }.authority-intro > p { max-width: 360px; margin-top: 9px; color: #a9aa95; font-size: 8px; line-height: 1.7; }
.authority-connect { display: flex; align-items: flex-start; gap: 8px; margin-top: 15px; padding-top: 12px; border-top: 1px solid rgba(233,223,193,.1); }.authority-connect .authority-seal { width: 19px; height: 19px; font-size: 9px; }.authority-connect strong,.authority-connect small { display: block; }.authority-connect strong { color: #d6c69e; font-size: 7px; line-height: 1.4; }.authority-connect small { margin-top: 3px; color: #9d9881; font-size: 6px; line-height: 1.5; }
.report-form { display: grid; gap: 9px; }.form-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }.form-heading strong { font: 600 12px Manrope,sans-serif; }.form-heading span { color: #9c9784; font-size: 7px; }.form-heading i { color: #e3a87b; font-style: normal; }
.report-form label, .form-dialog label { display: grid; gap: 5px; color: #bec4ae; font-size: 7px; font-weight: 600; }.report-form input,.report-form select,.report-form textarea,.form-dialog input,.form-dialog select { width: 100%; min-height: 31px; padding: 7px 9px; border: 1px solid rgba(223,230,203,.13); border-radius: 4px; background: rgba(12,19,14,.45); color: #e4e8d9; font-size: 8px; font-weight: 400; }.report-form input::placeholder,.report-form textarea::placeholder,.form-dialog input::placeholder { color: #737e70; }.report-form textarea { min-height: 67px; resize: vertical; }.report-form select,.form-dialog select { color-scheme: dark; }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.privacy-note { padding: 8px; border-left: 2px solid #bda26f; background: rgba(176,146,89,.05); color: #a19d88; font-size: 7px; line-height: 1.55; }
.report-actions { display: flex; flex-wrap: wrap; gap: 7px; }.report-actions .button { min-height: 33px; padding: 0 11px; font-size: 8px; }.report-result { color: #d3dfbd; font-size: 8px; line-height: 1.55; }.report-result[data-state=error] { color: #e5a98c; }
.console-footer { display: flex; justify-content: space-between; gap: 10px; padding: 11px 2px 3px; color: #768172; font-size: 6px; font-weight: 600; letter-spacing: .5px; }.console-footer button { padding: 0; border: 0; background: none; color: #aaba91; font-size: 7px; cursor: pointer; }
.story-dialog,.form-dialog { width: min(505px,calc(100vw - 26px)); max-height: min(88vh,780px); padding: clamp(19px,4vw,32px); overflow-y: auto; border: 1px solid rgba(217,229,196,.2); background: #18251c; color: #e9eee4; box-shadow: 0 30px 120px rgba(0,0,0,.59); }
.story-dialog::backdrop,.form-dialog::backdrop { background: rgba(4,10,6,.78); backdrop-filter: blur(5px); }.dialog-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }.dialog-close { display: grid; width: 28px; height: 28px; flex: 0 0 auto; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: #ced7c8; font-size: 17px; cursor: pointer; }
.dialog-index { display: block; margin-top: 26px; color: #a6bc86; font-size: 7px; font-weight: 700; letter-spacing: 1.2px; }.story-dialog h2,.form-dialog h2 { margin: 7px 0 12px; font: 600 29px 'Playfair Display',Georgia,serif; }.story-dialog > p,.form-dialog form > p { color: #aab3a3; font-size: 10px; line-height: 1.85; }.dialog-caveat { margin-top: 14px; padding: 11px; border-left: 2px solid #ceb078; background: rgba(208,171,108,.07); color: #d4c49c; font-size: 8px; line-height: 1.7; }.story-dialog > a { display: inline-block; margin-top: 13px; color: #bad096; font-size: 8px; }.story-dialog .button { display: flex; width: 100%; }
.form-dialog form { display: grid; gap: 12px; }.form-dialog h2 { margin: 4px 0 0; font-size: 20px; }.form-dialog form > p { font-size: 8px; }.dialog-hint { color: #93a38b!important; font-size: 7px!important; line-height: 1.6!important; }.form-dialog .button { width: 100%; }.form-error { min-height: 13px; color: #f1a382!important; font-size: 8px!important; }
.alert-toast { position: fixed; z-index: 2200; top: 17px; right: 18px; display: flex; max-width: min(420px,calc(100vw - 24px)); align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid rgba(242,170,117,.47); background: #38271d; box-shadow: 0 9px 36px rgba(0,0,0,.3); animation: toast-in .28s ease both; }.toast-symbol { display: grid; width: 21px; height: 21px; flex: 0 0 auto; place-items: center; border: 1px solid #dc9570; border-radius: 50%; color: #ffca9e; font-weight: 800; }.alert-toast strong { display: block; color: #f4cba4; font-size: 8px; letter-spacing: .5px; }.alert-toast p { margin-top: 5px; color: #dbd1bd; font-size: 8px; line-height: 1.5; }.alert-toast > button { margin-left: auto; border: 0; background: transparent; color: #dbc4ab; font-size: 16px; cursor: pointer; }
.screen-reader-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; clip-path: inset(50%); }
@keyframes screen-enter { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@keyframes landscape-arrive { from { transform: scale(1.02); } to { transform: scale(1.09); } }
@keyframes film-pan { from { transform: scale(1.03) translateX(-1%); } to { transform: scale(1.23) translateX(1%); } }
@keyframes dot-pulse { 50% { box-shadow: 0 0 0 7px rgba(175,216,132,.025); } }
@keyframes marker-pulse { 50% { box-shadow: 0 0 0 9px rgba(219,129,90,.03),0 0 25px rgba(226,145,99,.55); } }
@keyframes toast-in { from { transform: translateY(-8px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

@media (max-width: 1120px) {
  .side-rail { width: 207px; }.guardian-main { margin-left: 207px; }.control-deck { grid-template-columns: 1fr 1fr 1fr; }.control-intro { grid-column: span 2; }.demo-run-status { grid-column: 1/-1; }
  .landscape-content { grid-template-columns: .85fr 1.15fr; gap: 34px; }.film-media { min-height: 395px; }.story-card { padding: 13px; }.story-card-header h2 { font-size: 23px; }
}
@media (max-width: 800px) {
  .entry-header { padding: 20px 22px; }.entry-copy { width: 100%; padding-right: 24px; padding-left: clamp(24px,8vw,65px); }.entry-copy h1 { font-size: clamp(53px,11vw,78px); }.entry-vertical { display: none; }
  .journey-topbar { height: 64px; }.journey-progress { gap: 7px; font-size: 6px; }.journey-progress b { width: 13px; }.text-button { font-size: 0; }.text-button:first-letter { font-size: 14px; }
  .landscape-content { width: calc(100% - 40px); grid-template-columns: 1fr; gap: 26px; padding-top: 30px; }.landscape-copy h1 { font-size: clamp(39px,8vw,54px); }.landscape-lede { max-width: 570px; }.landscape-fact { max-width: 580px; margin-top: 12px; }.film-media { height: min(57vh,470px); min-height: 310px; }.story-rail { width: calc(100% - 40px); }
  .side-rail { z-index: 1300; width: 250px; transform: translateX(-100%); transition: transform .22s; box-shadow: 14px 0 37px rgba(0,0,0,.3); }.side-rail.is-open { transform: translateX(0); }.guardian-main { margin-left: 0; }.menu-button { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border: 1px solid var(--line); background: transparent; color: #d5e0ce; cursor: pointer; }.console-header { gap: 11px; padding: 9px 13px; }.console-heading h1 { font-size: 11px; }.console-heading .eyebrow { font-size: 6px; }.header-right { gap: 8px; }.honest-mode { max-width: 125px; padding: 5px; font-size: 6px; white-space: normal; }.local-time { display: none; }
  .console-content { padding: 13px 12px; }.monitor-grid { grid-template-columns: minmax(0,1.35fr) minmax(200px,.8fr); }.map-stage { height: 33vh; min-height: 260px; }.authority-panel { gap: 22px; }.context-location .micro-label { max-width: 160px; }
}
@media (max-width: 590px) {
  .entry-meta { max-width: 148px; font-size: 6px; }.entry-meta small { font-size: 7px; }.entry-header { padding: 17px; }.identity-mark { width: 35px; height: 35px; }.identity strong { font-size: 16px; }.identity small { font-size: 7px; }.entry-copy { padding-left: 23px; }.entry-copy h1 { font-size: clamp(46px,13.7vw,70px); letter-spacing: -1.5px; }.entry-copy > p { max-width: 270px; font-size: 11px; }.entry-cta { min-width: 235px; margin-top: 25px; }.entry-note { margin-top: 41px; font-size: 7px; }.entry-caption { right: 13px; bottom: 13px; left: 13px; flex-wrap: wrap; justify-content: flex-start; font-size: 6px; }
  .journey-topbar { gap: 8px; padding: 0 12px; }.journey-progress { gap: 5px; }.journey-progress > span { font-size: 0; }.journey-progress .progress-current { font-size: 6px; }.journey-progress .progress-current i { font-size: 6px; }.journey-progress b { width: 10px; }.text-button { display: none; }
  .landscape-content { width: calc(100% - 28px); padding-top: 26px; }.landscape-copy .hero-kicker { font-size: 7px; }.landscape-copy h1 { font-size: 40px; }.landscape-lede { font-size: 10px; }.film-media { min-height: 330px; height: 48vh; }.film-title { top: 13px; right: 9px; left: 9px; }.film-title > span { font-size: 5px; letter-spacing: 1px; }.film-title h2 { margin-top: 5px; font-size: 29px; }.film-title small { margin-top: 5px; font-size: 6px; }.film-story-caption { right: 10px; bottom: 104px; left: 10px; }.film-story-caption > span { font-size: 6px; }.film-story-caption p { margin-top: 5px; font-size: 11px; line-height: 1.5; }.film-caption { right: 10px; bottom: 72px; left: 10px; font-size: 6px; }.film-caption small { font-size: 6px; }.film-controls { right: 7px; bottom: 8px; left: 7px; gap: 5px; }.film-controls > button { min-width: 24px; height: 25px; padding: 0 5px; font-size: 9px; }.film-controls .film-play { min-width: 92px; height: 28px; font-size: 7px; }.film-elapsed { font-size: 6px; }.film-language select { max-width: 63px; height: 25px; font-size: 6px; }.film-credit-line { font-size: 6px; }.story-rail { width: calc(100% - 28px); grid-template-columns: 1fr 1fr; }.story-rail button { padding: 10px 7px 10px 0; }.story-rail button + button { padding-left: 8px; }.story-rail button:nth-child(3) { border-left: 0; }.story-rail button b { font-size: 8px; }
  .honest-mode { max-width: 105px; font-size: 5px; }.console-heading h1 { max-width: 202px; line-height: 1.3; }.integrity-banner { align-items: flex-start; }.integrity-banner > a { align-self: center; font-size: 6px; }.integrity-banner p { font-size: 7px; }
  .live-context { grid-template-columns: minmax(0,1fr) repeat(3,auto); gap: 8px; padding: 9px; }.context-location { grid-column: 1/-1; }.context-value { padding: 0 8px 0 0; }.context-value strong { font-size: 13px; }.context-value small { font-size: 5px; }.weather-credit { align-self: center; font-size: 6px; }
  .monitor-grid { grid-template-columns: 1fr; }.story-card { min-height: 210px; padding: 15px; }.map-stage { height: 39vh; min-height: 275px; }.map-bottom { flex-wrap: wrap; padding: 7px; }.map-bottom > span { flex-basis: 100%; }.map-overlay { gap: 4px; font-size: 5px; }.key-dot { margin-left: 2px; }
  .camera-workspace { grid-template-columns: 1fr; }.camera-preview { min-height: 175px; }
  .control-deck { grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px; }.control-intro { grid-column: 1/-1; }.scenario-field { grid-column: 1/-1; }.control-deck .button { font-size: 7px; }.sound-control { justify-content: center; }.demo-run-status { font-size: 6px; }
  .event-row { grid-template-columns: 25px minmax(0,1fr); padding: 9px; }.event-actions { grid-column: 2; flex-wrap: wrap; }.event-actions .status-tag { margin-right: auto; }.event-meta { gap: 4px; }.alert-heading { align-items: flex-start; }
  .authority-panel { grid-template-columns: 1fr; gap: 18px; padding: 15px; }.authority-intro h2 { font-size: 28px; }.form-row { grid-template-columns: 1fr 1fr; gap: 6px; }.console-footer { flex-direction: column; line-height: 1.6; }.report-actions > * { flex: 1; }
}
@media (max-width: 370px) {
  .journey-progress { display: none; }.console-heading h1 { max-width: 170px; font-size: 10px; }.honest-mode { max-width: 91px; line-height: 1.4; }.map-mode { font-size: 0; }.map-mode::first-letter { font-size: 12px; }.map-overlay { left: 4px; }.weather-credit { display: none; }.context-value:last-of-type { border-right: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}