*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/*
! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box;
  /* 1 */
  border-width: 0;
  /* 2 */
  border-style: solid;
  /* 2 */
  border-color: #e5e7eb;
  /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -moz-tab-size: 4;
  /* 3 */
  -o-tab-size: 4;
     tab-size: 4;
  /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  /* 4 */
  font-feature-settings: normal;
  /* 5 */
  font-variation-settings: normal;
  /* 6 */
  -webkit-tap-highlight-color: transparent;
  /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0;
  /* 1 */
  color: inherit;
  /* 2 */
  border-top-width: 1px;
  /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-feature-settings: normal;
  /* 2 */
  font-variation-settings: normal;
  /* 3 */
  font-size: 1em;
  /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0;
  /* 1 */
  border-color: inherit;
  /* 2 */
  border-collapse: collapse;
  /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-feature-settings: inherit;
  /* 1 */
  font-variation-settings: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  letter-spacing: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button;
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  /* 1 */
  vertical-align: middle;
  /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

.static {
  position: static;
}

.table {
  display: table;
}

.grid {
  display: grid;
}

.contents {
  display: contents;
}

.rounded {
  border-radius: 0.25rem;
}

:root{
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  color:#1b2637;
  background:#f5f6f8;
  font-synthesis:none;
  font-size:14px
}

*{
  box-sizing:border-box
}

body{
  margin:0
}

button,input,textarea,select{
  font:inherit
}

button,a,input,summary,select,textarea{
  -webkit-tap-highlight-color:transparent
}

button,summary{
  cursor:pointer
}

button:disabled{
  opacity:.55;
  cursor:wait
}

button{
  transition:background .15s,transform .15s
}

button:focus-visible,a:focus-visible,summary:focus-visible{
  outline:3px solid #ed8157;
  outline-offset:4px
}

a{
  text-decoration:none;
  color:inherit
}

h1,h2,h3,p{
  margin:0
}

button{
  border:0
}

input,textarea,select{
  width:100%;
  border:1px solid #dfe3e9;
  border-radius:7px;
  background:#fff;
  padding:11px 12px;
  color:#243145;
  outline:none
}

input:focus,textarea:focus,select:focus{
  border-color:#e7794d;
  box-shadow:0 0 0 3px #f07d4b14
}

input::-moz-placeholder, textarea::-moz-placeholder{
  color:#99a3ae
}

input::placeholder,textarea::placeholder{
  color:#99a3ae
}

label{
  display:block;
  font-size:12px;
  font-weight:600;
  color:#596473
}

label input,label textarea,label select{
  display:block;
  margin-top:8px
}

form>label{
  margin-top:17px
}

.app-shell{
  display:flex;
  min-height:100vh
}

.sidebar{
  width:244px;
  flex-shrink:0;
  background:#111b2b;
  color:#acb5c5;
  position:fixed;
  inset:0 auto 0 0;
  padding:36px 23px;
  display:flex;
  flex-direction:column;
  z-index:20
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:#fff;
  font-size:23px;
  font-weight:750;
  letter-spacing:-.8px
}

.brand-mark{
  display:grid;
  place-items:center;
  width:39px;
  height:39px;
  background:#ef7b4a;
  color:#fff;
  border-radius:12px;
  font-size:24px;
  transform:rotate(-8deg);
  flex-shrink:0
}

.brand small{
  display:block;
  font-size:6.4px;
  letter-spacing:1.75px;
  color:#8e9bb0;
  font-weight:600;
  margin-top:6px
}

.nav-label{
  font-size:9px;
  letter-spacing:1.7px;
  color:#657389;
  margin:59px 13px 15px
}

.sidebar nav{
  display:grid;
  gap:8px
}

.sidebar nav button{
  display:flex;
  align-items:center;
  gap:13px;
  width:100%;
  padding:14px 13px;
  border-radius:7px;
  color:#a8b4c6;
  background:transparent;
  text-align:left;
  font-size:12px;
  font-weight:600
}

.sidebar nav button:hover{
  background:#1b283b
}

.sidebar nav button.active{
  background:#ef7b4a;
  color:#fff;
  box-shadow:0 5px 15px #0001
}

.nav-icon{
  font-size:20px;
  line-height:20px;
  width:22px;
  text-align:center
}

.nav-arrow{
  margin-left:auto;
  font-size:18px;
  opacity:.7
}

.sidebar-note{
  border:1px solid #2a3545;
  border-radius:10px;
  padding:22px 18px;
  margin-top:auto;
  background:linear-gradient(140deg,#1d2b3e,#141e2e)
}

.orbit{
  display:block;
  font-size:43px;
  line-height:1;
  color:#ea8d64;
  margin-bottom:20px
}

.sidebar-note strong{
  font-size:14px;
  color:#e0e5ed;
  font-weight:500;
  line-height:1.6;
  display:block
}

.sidebar-note p{
  font-size:11px;
  line-height:1.9;
  margin-top:10px;
  color:#8492a7
}

.tiny-label{
  font-size:7px;
  letter-spacing:1.5px;
  display:block;
  margin-top:21px;
  color:#b29b8f
}

.sidebar-bottom{
  font-size:9px;
  display:flex;
  align-items:center;
  gap:7px;
  margin:27px 2px 0;
  color:#738298
}

.status-dot{
  height:5px;
  width:5px;
  background:#73b79a;
  border-radius:50%;
  display:inline-block;
  flex-shrink:0
}

.main-shell{
  margin-left:244px;
  min-width:0;
  width:calc(100% - 244px)
}

.topbar{
  height:83px;
  background:#fff;
  border-bottom:1px solid #e6e9ed;
  padding:0 43px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px
}

.breadcrumb{
  font-size:11px;
  color:#929ba7;
  display:flex;
  align-items:center;
  gap:18px
}

.breadcrumb strong{
  color:#495668;
  font-weight:500
}

.account{
  display:flex;
  align-items:center;
  gap:11px
}

.live-label{
  font-size:7px;
  letter-spacing:1.25px;
  color:#8b96a3;
  display:flex;
  align-items:center;
  gap:7px;
  margin-right:20px
}

.avatar{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:50%;
  background:#fce8dd;
  color:#c7683e;
  font-weight:700
}

.account-name{
  font-size:12px
}

.text-button{
  background:none;
  color:#718096;
  font-size:11px;
  padding:5px
}

main{
  max-width:1510px;
  margin:0 auto;
  padding:36px 43px 0
}

.eyebrow{
  font-size:8px;
  letter-spacing:1.7px;
  font-weight:650;
  color:#89929e;
  display:block
}

.page-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:28px;
  gap:20px
}

.page-heading h1{
  font-size:30px;
  font-weight:650;
  letter-spacing:-1.1px;
  margin-top:10px
}

.page-heading p{
  color:#8b95a1;
  font-size:12px;
  margin-top:10px;
  line-height:1.7
}

.heading-stamp{
  border:1px solid #dce1e6;
  border-radius:5px;
  color:#9da6b0;
  font-size:8px;
  letter-spacing:2px;
  text-align:center;
  padding:11px 16px;
  transform:rotate(-5deg);
  line-height:1.7
}

.heading-stamp b{
  display:block;
  font-size:9px;
  color:#7e8996;
  font-weight:500
}

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  border-radius:6px;
  font-size:11px;
  font-weight:600;
  padding:13px 19px;
  min-height:40px
}

.button span{
  font-size:17px;
  font-weight:400
}

.button:hover:not(:disabled){
  transform:translateY(-1px)
}

.button-orange{
  background:#ef7b4a;
  color:#fff
}

.button-orange:hover:not(:disabled){
  background:#e46d3b
}

.button-dark{
  background:#192637;
  color:#fff
}

.button-dark:hover:not(:disabled){
  background:#2b3c53
}

.button-light{
  background:#fff;
  border:1px solid #e1e5eb;
  color:#536173
}

.button.small{
  font-size:10px;
  min-height:32px;
  padding:7px 12px;
  gap:13px
}

.full{
  width:100%;
  justify-content:space-between
}

.hero{
  background:#17273a;
  border-radius:11px;
  position:relative;
  overflow:hidden;
  min-height:291px;
  color:#fff;
  display:flex;
  margin-bottom:25px
}

.hero-copy{
  padding:32px 35px;
  position:relative;
  z-index:2;
  width:60%
}

.hero-kicker{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:7px;
  letter-spacing:1.8px;
  color:#b6c4d5
}

.hero-kicker span{
  width:5px;
  height:5px;
  background:#ed8e63;
  border-radius:50%
}

.hero h2{
  font-size:38px;
  line-height:1.12;
  letter-spacing:-1px;
  font-weight:550;
  margin-top:18px
}

.hero p{
  font-size:11px;
  line-height:1.9;
  color:#a9b6c7;
  margin-top:13px;
  margin-bottom:20px
}

.hero-art{
  position:absolute;
  inset:0 0 0 43%;
  overflow:hidden;
  background:radial-gradient(ellipse at 68% 60%,#36516b66,transparent 65%)
}

.globe-ring{
  position:absolute;
  border:1px solid #73899d27;
  border-radius:50%;
  width:320px;
  height:320px;
  left:25%;
  top:7%
}

.ring-two{
  width:190px;
  height:320px;
  left:37%
}

.ring-three{
  width:320px;
  height:105px;
  top:44%;
  transform:rotate(-28deg)
}

.flight-trail{
  position:absolute;
  left:13%;
  top:36%;
  width:350px;
  height:125px;
  border-top:2px dashed #e7aa7b70;
  border-radius:50%;
  transform:rotate(-33deg)
}

.hero-plane{
  position:absolute;
  left:64%;
  top:25%;
  font-size:96px;
  line-height:1;
  color:#f4ede6;
  transform:rotate(-25deg);
  text-shadow:3px 18px 22px #0004
}

.hero-coordinate{
  position:absolute;
  right:26px;
  top:22px;
  color:#8a9bae;
  font-size:7px;
  letter-spacing:1.8px
}

.art-label{
  position:absolute;
  bottom:67px;
  left:43%;
  font-size:7px;
  color:#8498ad;
  letter-spacing:1.5px
}

.art-label strong{
  display:block;
  font-weight:400;
  font-size:17px;
  color:#e2e6e9;
  letter-spacing:0;
  margin-top:9px
}

.hero-number{
  position:absolute;
  right:25px;
  bottom:22px;
  font-size:7px;
  letter-spacing:1.8px;
  color:#8f9db0
}

.stats-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:19px;
  margin-bottom:26px
}

.stat{
  background:#fff;
  border:1px solid #e5e8ed;
  border-radius:9px;
  padding:20px 21px
}

.stat>div{
  display:flex;
  align-items:center;
  justify-content:space-between
}

.stat-icon{
  display:grid;
  place-items:center;
  width:31px;
  height:31px;
  border-radius:8px;
  font-size:21px
}

.orange{
  color:#e18258;
  background:#fff0e8
}

.blue{
  color:#7791b3;
  background:#edf3fa
}

.green{
  color:#74a294;
  background:#edf7f3
}

.stat-tag{
  font-size:7px;
  letter-spacing:1.2px;
  color:#a3aab4
}

.stat h3{
  font-size:29px;
  font-weight:650;
  letter-spacing:-1px;
  margin:15px 0 8px
}

.stat h3 small{
  font-size:10px;
  letter-spacing:0;
  font-weight:400;
  margin-left:8px;
  color:#9aa3ae
}

.stat p{
  font-size:11px;
  color:#596676
}

.stat p span{
  display:block;
  font-size:9px;
  color:#a5adb7;
  margin-top:7px
}

.dashboard-grid{
  display:grid;
  grid-template-columns:minmax(0,1.64fr) minmax(280px,1fr);
  gap:23px
}

.primary-column,.secondary-column{
  display:flex;
  flex-direction:column;
  gap:23px;
  min-width:0
}

.panel{
  background:#fff;
  border:1px solid #e4e8ed;
  border-radius:9px;
  overflow:hidden
}

.panel-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:23px 24px 19px;
  gap:13px
}

.panel-heading h2{
  font-size:16px;
  font-weight:600;
  letter-spacing:-.3px;
  margin-top:7px
}

.panel-heading p{
  font-size:11px;
  color:#94a0ac;
  margin-top:9px;
  line-height:1.7
}

.pill{
  font-size:8px;
  color:#8995a2;
  background:#f5f7f9;
  border:1px solid #e9edf0;
  padding:6px 9px;
  border-radius:4px;
  white-space:nowrap
}

.section-icon{
  height:31px;
  width:31px;
  background:#f8f3ed;
  color:#ce986e;
  border-radius:7px;
  display:grid;
  place-items:center;
  font-size:22px
}

.map-wrap{
  position:relative;
  margin:0 18px;
  background:#f5f8fa;
  border-radius:6px;
  overflow:hidden
}

.world-map{
  width:100%;
  height:auto;
  min-height:225px;
  display:block
}

.map-empty{
  position:absolute;
  bottom:10px;
  left:0;
  right:0;
  text-align:center;
  pointer-events:none;
  background:linear-gradient(transparent,#f5f8fae8 35%);
  padding:30px 6px 10px
}

.map-empty strong{
  font-size:11px;
  font-weight:500;
  color:#65788b
}

.map-empty p{
  font-size:9px;
  margin-top:7px;
  color:#8f9eac
}

.map-footer{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:17px 24px;
  color:#98a3af;
  font-size:7px;
  letter-spacing:.5px
}

.map-footer span:first-child{
  font-size:9px;
  letter-spacing:0;
  display:flex;
  align-items:center;
  gap:6px
}

.map-footer i{
  display:inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#eb8053
}

.flight-panel form{
  padding:0 23px 18px
}

.route-inputs{
  display:flex;
  align-items:center;
  gap:14px
}

.route-inputs>label{
  min-width:0;
  flex:1;
  font-size:8px;
  letter-spacing:1.6px
}

.route-inputs input{
  font-size:23px;
  font-weight:600;
  letter-spacing:2px;
  text-transform:uppercase;
  padding:11px 12px;
  color:#36455a
}

.route-inputs>span{
  color:#bcc5ce;
  font-size:21px;
  margin-top:20px
}

.optional{
  float:right;
  font-size:9px;
  color:#b1b8c0;
  font-weight:400
}

.form-row{
  display:flex;
  gap:10px;
  margin:17px 0 20px
}

.form-row>label{
  min-width:0;
  flex:1
}

.form-hint{
  font-size:9px;
  line-height:1.8;
  text-align:center;
  color:#9aa4af;
  margin-top:13px
}

.airport-search{
  margin-top:13px
}

.airport-search summary{
  font-size:9px;
  color:#8c99a8;
  display:flex;
  justify-content:space-between;
  list-style:none;
  padding:2px 0
}

.airport-search summary>span{
  font-size:17px
}

.search-row{
  display:flex;
  gap:5px;
  margin-top:10px
}

.search-row input{
  font-size:11px;
  padding:8px;
  min-width:0
}

.search-results{
  max-height:230px;
  overflow:auto
}

.search-result{
  display:flex;
  align-items:center;
  gap:8px;
  border-top:1px solid #edf0f3;
  padding:10px 0
}

.search-result>div{
  flex:1;
  min-width:0
}

.search-result strong{
  font-size:10px;
  color:#e0784c
}

.search-result span,.search-result small{
  display:block;
  font-size:9px;
  line-height:1.5;
  color:#8e98a4
}

.search-result button{
  font-size:8px;
  background:#f0f3f6;
  color:#67768b;
  padding:7px;
  border-radius:4px
}

.search-message{
  color:#8d6a53;
  font-size:10px;
  line-height:1.6;
  margin:7px 0
}

.empty-state{
  text-align:center;
  padding:30px 20px 37px
}

.empty-state>span{
  display:block;
  font-size:31px;
  color:#c1ccd7;
  margin-bottom:13px
}

.empty-state h3{
  font-size:12px;
  font-weight:500;
  color:#6b798b
}

.empty-state p{
  font-size:10px;
  color:#9da7b2;
  line-height:1.7;
  margin-top:9px
}

.flight-list{
  padding:0 23px 6px
}

.flight-row{
  display:flex;
  align-items:center;
  gap:13px;
  padding:17px 0;
  border-top:1px solid #edf0f3
}

.flight-symbol{
  background:#f2f5f9;
  color:#8c9fb6;
  border-radius:7px;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  font-size:18px
}

.flight-route{
  flex:1
}

.flight-route strong{
  font-size:14px;
  letter-spacing:1px;
  font-weight:600
}

.flight-route strong span{
  color:#b4bdc8;
  margin:0 12px;
  font-weight:400
}

.flight-row small{
  display:block;
  font-size:9px;
  color:#a0a9b5;
  margin-top:6px
}

.flight-meta{
  text-align:right
}

.flight-meta strong{
  font-size:11px;
  font-weight:500
}

.badge-empty{
  text-align:center;
  padding:9px 23px 26px
}

.locked-badge{
  border:1px dashed #e6d9cd;
  border-radius:50%;
  width:51px;
  height:51px;
  margin:0 auto 15px;
  display:grid;
  place-items:center;
  color:#cdb79f;
  font-size:30px;
  background:#faf7f3
}

.badge-empty h3{
  font-size:11px;
  color:#738092;
  font-weight:500
}

.badge-empty p{
  font-size:10px;
  line-height:1.8;
  color:#a0a8b3;
  margin-top:8px
}

.badge-list{
  padding:0 24px 13px
}

.badge-item{
  display:flex;
  align-items:center;
  gap:13px;
  padding:12px 0;
  border-top:1px solid #eef0f3
}

.badge-item>span{
  font-size:28px;
  color:#d29c50;
  width:36px;
  text-align:center
}

.badge-item h3{
  font-size:11px;
  font-weight:600
}

.badge-item p{
  font-size:10px;
  line-height:1.6;
  color:#939eaa;
  margin-top:4px
}

.import-panel{
  margin-top:24px
}

.import-panel>.panel-heading{
  padding-bottom:17px
}

.import-panel>details>summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 24px;
  background:#fafbfc;
  border-top:1px solid #eef0f3;
  font-size:11px;
  color:#748297;
  list-style:none
}

.import-content{
  padding:22px 24px
}

.import-controls{
  display:flex;
  align-items:flex-end;
  gap:25px
}

.import-controls>label{
  flex:1
}

.file-label input{
  padding:6px
}

.import-content>.form-hint{
  text-align:left;
  margin-bottom:18px
}

.import-content>label{
  margin-bottom:17px
}

.import-content textarea{
  font-family:monospace;
  font-size:11px;
  resize:vertical;
  line-height:1.8
}

.field-error{
  font-size:11px;
  color:#b4503f;
  line-height:1.7;
  margin:12px 0
}

.import-errors{
  border:1px solid #f0d7ca;
  background:#fff7f1;
  padding:18px;
  margin-top:20px;
  border-radius:6px;
  color:#98634a;
  font-size:11px;
  line-height:1.8
}

.import-errors ul{
  padding-left:20px;
  list-style:disc
}

.import-errors p{
  margin-top:9px;
  font-size:10px
}

footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:27px 0;
  color:#a3adb8;
  font-size:8px
}

footer>span:first-child{
  letter-spacing:.8px
}

.footer-divider{
  padding:0 12px;
  color:#c9cfd6
}

.alert{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:13px 17px;
  border-radius:6px;
  font-size:12px;
  line-height:1.6;
  margin-bottom:23px;
  gap:15px
}

.alert button{
  background:none;
  font-size:22px;
  color:inherit
}

.error{
  background:#fdefea;
  border:1px solid #f3d9cd;
  color:#aa5b42
}

.success{
  background:#eaf5ee;
  border:1px solid #cfe5d6;
  color:#518164
}

.passport-grid{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);
  gap:23px;
  margin:23px 0
}

.airport-collection{
  padding:0 24px 15px
}

.airport-card{
  display:flex;
  align-items:center;
  gap:15px;
  border-top:1px solid #edf0f3;
  padding:17px 0
}

.airport-card>strong{
  font-size:20px;
  color:#e57c50;
  min-width:53px
}

.airport-card>div{
  flex:1
}

.airport-card h3{
  font-size:11px;
  font-weight:600
}

.airport-card p{
  color:#9ba6b3;
  font-size:10px;
  margin-top:6px
}

.leaderboard-banner{
  padding:30px 34px;
  border-radius:10px;
  background:#1a2b3d;
  color:#fff;
  display:flex;
  align-items:center;
  gap:29px;
  margin-bottom:25px
}

.leaderboard-banner>span{
  font-size:54px;
  color:#edb17b
}

.leaderboard-banner .eyebrow{
  color:#ad9c84
}

.leaderboard-banner h2{
  font-size:23px;
  font-weight:500;
  letter-spacing:-.5px;
  margin-top:10px
}

.leaderboard-banner p{
  color:#a7b5c5;
  font-size:11px;
  margin-top:12px
}

.table-scroll{
  overflow:auto
}

table{
  width:100%;
  border-collapse:collapse;
  white-space:nowrap;
  text-align:left
}

th{
  font-size:8px;
  font-weight:500;
  letter-spacing:1px;
  text-transform:uppercase;
  background:#f9fafb;
  color:#9aa5b1;
  padding:14px 24px;
  border-block:1px solid #edf0f3
}

td{
  font-size:11px;
  color:#748298;
  padding:20px 24px;
  border-bottom:1px solid #f0f2f5
}

td strong{
  font-weight:550;
  color:#35445a
}

.rank{
  color:#8e9bad;
  font-size:12px
}

.top-rank{
  color:#dc9864;
  font-weight:700
}

.my-standing{
  background:#fff7f1
}

.you-label{
  font-size:7px;
  background:#f9e3d6;
  color:#ca7f54;
  margin-left:10px;
  padding:3px 5px;
  border-radius:3px
}

.table-footer{
  padding:18px 24px;
  font-size:9px;
  color:#a2abb6
}

.modal-backdrop{
  position:fixed;
  inset:0;
  background:#0d192bc4;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:25px;
  -webkit-backdrop-filter:blur(5px);
          backdrop-filter:blur(5px);
  overflow:auto
}

.auth-modal{
  background:#fff;
  border-radius:13px;
  width:440px;
  padding:35px;
  position:relative;
  box-shadow:0 20px 100px #0003;
  max-height:calc(100dvh - 50px);
  overflow:auto
}

.auth-modal>.brand-mark{
  margin-bottom:25px
}

.auth-modal h2{
  font-size:25px;
  font-weight:600;
  letter-spacing:-.8px;
  margin-top:12px
}

.auth-modal>p{
  font-size:11px;
  color:#9aa4b0;
  margin-top:11px;
  line-height:1.7
}

.modal-close{
  position:absolute;
  top:12px;
  right:16px;
  background:none;
  color:#8b97a5;
  font-size:26px;
  padding:5px
}

.auth-tabs{
  display:flex;
  border-bottom:1px solid #e4e9ef;
  margin:28px 0 20px
}

.auth-tabs button{
  flex:1;
  padding:12px;
  background:none;
  border-bottom:2px solid transparent;
  color:#99a3af;
  font-size:12px
}

.auth-tabs button.chosen{
  color:#d47248;
  border-color:#e68a5e
}

.auth-modal form>label{
  margin-bottom:19px
}

.auth-modal .auth-footnote{
  font-size:9px;
  text-align:center;
  margin-top:21px
}

@media(min-width:1500px){
  main{
    padding-top:43px
  }

  .hero{
    min-height:315px
  }

  .hero-copy{
    padding:38px 40px
  }

  .hero h2{
    font-size:43px
  }

  .hero-plane{
    font-size:112px
  }

  .sidebar{
    width:260px
  }

  .main-shell{
    margin-left:260px;
    width:calc(100% - 260px)
  }
}

@media(max-width:1150px){
  .sidebar{
    width:205px;
    padding:31px 17px
  }

  .brand{
    font-size:20px
  }

  .brand small{
    font-size:5.2px
  }

  .brand-mark{
    width:34px;
    height:34px
  }

  .main-shell{
    margin-left:205px;
    width:calc(100% - 205px)
  }

  main{
    padding:30px 25px 0
  }

  .topbar{
    padding:0 25px
  }

  .live-label{
    display:none
  }

  .dashboard-grid{
    grid-template-columns:minmax(0,1.3fr) minmax(270px,1fr);
    gap:18px
  }

  .panel-heading{
    padding:20px 18px
  }

  .stat{
    padding:17px
  }

  .stat-tag{
    font-size:6px
  }

  .hero-copy{
    padding:30px
  }

  .hero h2{
    font-size:34px
  }

  .hero-plane{
    left:58%;
    font-size:80px
  }

  .map-footer>span:last-child{
    display:none
  }

  .flight-panel form{
    padding:0 18px 17px
  }

  .hero-art{
    left:40%
  }

  .globe-ring{
    left:15%
  }

  .ring-two{
    left:30%
  }

  .ring-three{
    left:15%
  }

  .heading-stamp{
    display:none
  }
}

@media(max-width:900px){
  .sidebar{
    width:177px;
    padding:29px 13px
  }

  .brand{
    font-size:18px;
    gap:7px
  }

  .brand small{
    font-size:4.7px;
    letter-spacing:1.2px
  }

  .sidebar nav button{
    font-size:11px;
    gap:9px;
    padding:13px 9px
  }

  .sidebar-note{
    padding:18px 12px
  }

  .sidebar-note strong{
    font-size:12px
  }

  .sidebar-bottom{
    font-size:7px
  }

  .nav-label{
    font-size:8px;
    margin-left:9px
  }

  .main-shell{
    margin-left:177px;
    width:calc(100% - 177px)
  }

  .dashboard-grid{
    grid-template-columns:1fr
  }

  .secondary-column{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:start;
    gap:18px
  }

  .page-heading h1{
    font-size:27px
  }

  .stats-grid{
    gap:12px
  }

  .stat-tag{
    display:none
  }

  .hero-art{
    left:35%
  }

  .hero-copy{
    width:64%
  }

  .hero h2{
    font-size:32px
  }

  .art-label{
    left:50%
  }

  .passport-grid{
    grid-template-columns:1fr
  }

  .account-name{
    display:none
  }

  .world-map{
    max-height:360px
  }

  .map-empty{
    bottom:15px
  }

  .map-footer>span:last-child{
    display:block
  }

  .table-scroll th,.table-scroll td{
    padding:16px
  }

  .stat h3{
    font-size:25px
  }

  .stat h3 small{
    font-size:9px
  }

  .hero p{
    font-size:10px
  }

  .hero-plane{
    left:62%
  }

  .hero-coordinate{
    font-size:6px
  }
}

@media(max-width:640px){
  .app-shell{
    display:block
  }

  .sidebar{
    position:static;
    width:100%;
    padding:17px 20px 12px;
    display:block
  }

  .brand{
    font-size:22px
  }

  .brand small{
    font-size:5.6px;
    letter-spacing:1.6px
  }

  .brand-mark{
    height:33px;
    width:33px
  }

  .sidebar nav{
    display:flex;
    margin-top:19px;
    gap:7px
  }

  .sidebar nav button{
    font-size:10px;
    padding:10px 9px;
    justify-content:center;
    gap:7px;
    flex:1;
    white-space:nowrap
  }

  .nav-icon{
    font-size:17px;
    width:17px
  }

  .nav-arrow,.nav-label,.sidebar-note,.sidebar-bottom{
    display:none
  }

  .main-shell{
    width:100%;
    margin-left:0
  }

  .topbar{
    height:57px;
    padding:0 20px
  }

  .breadcrumb{
    font-size:9px;
    gap:10px
  }

  .account{
    gap:7px
  }

  .account-name{
    display:none
  }

  .avatar{
    width:26px;
    height:26px;
    font-size:11px
  }

  .text-button{
    font-size:9px
  }

  main{
    padding:26px 19px 0
  }

  .page-heading{
    margin-bottom:22px
  }

  .page-heading h1{
    font-size:28px;
    line-height:1.2
  }

  .page-heading p{
    font-size:11px;
    line-height:1.8;
    max-width:300px
  }

  .eyebrow{
    font-size:7px;
    letter-spacing:1.3px
  }

  .hero{
    min-height:287px;
    margin-bottom:18px
  }

  .hero-copy{
    padding:26px 24px;
    width:78%
  }

  .hero-kicker{
    font-size:6px;
    letter-spacing:1.1px
  }

  .hero h2{
    font-size:34px;
    margin-top:20px
  }

  .hero p{
    font-size:10px
  }

  .hero-art{
    left:32%;
    opacity:.58
  }

  .hero-plane{
    font-size:73px;
    left:59%;
    top:34%
  }

  .hero-coordinate,.art-label{
    display:none
  }

  .hero-number{
    font-size:5px;
    right:17px;
    bottom:15px
  }

  .globe-ring{
    width:280px;
    height:280px;
    top:17%;
    left:10%
  }

  .ring-two{
    width:170px;
    height:280px;
    left:31%
  }

  .ring-three{
    height:95px;
    top:52%
  }

  .flight-trail{
    left:8%;
    top:49%
  }

  .stats-grid{
    gap:8px;
    margin-bottom:19px
  }

  .stat{
    padding:13px 10px
  }

  .stat h3{
    font-size:23px;
    letter-spacing:-.8px;
    margin:14px 0 8px
  }

  .stat h3 small{
    display:block;
    margin:4px 0 0;
    font-size:8px;
    letter-spacing:0
  }

  .stat p{
    font-size:9px
  }

  .stat p span{
    font-size:7px;
    line-height:1.6;
    min-height:23px
  }

  .stat-icon{
    width:27px;
    height:27px;
    font-size:18px
  }

  .secondary-column{
    display:flex;
    flex-direction:column
  }

  .secondary-column>.panel{
    width:100%
  }

  .dashboard-grid,.primary-column,.secondary-column{
    gap:18px
  }

  .panel-heading{
    padding:20px 18px 17px
  }

  .panel-heading h2{
    font-size:15px
  }

  .map-wrap{
    margin:0 12px
  }

  .world-map{
    min-height:185px
  }

  .map-footer{
    padding:15px 18px
  }

  .map-footer>span:last-child{
    font-size:5px
  }

  .map-empty strong{
    font-size:9px
  }

  .map-empty p{
    font-size:8px;
    line-height:1.7
  }

  .map-empty{
    bottom:0;
    padding:27px 5px 9px
  }

  .flight-panel form{
    padding:0 19px 18px
  }

  .route-inputs input{
    font-size:26px
  }

  .form-hint{
    font-size:9px
  }

  .import-controls{
    display:block
  }

  .file-label{
    margin-top:18px
  }

  .import-content{
    padding:18px
  }

  .import-panel>.panel-heading{
    padding:20px 18px
  }

  .import-panel>details>summary{
    padding:16px 18px
  }

  .flight-list{
    padding:0 17px 5px
  }

  .flight-symbol{
    width:28px;
    height:28px;
    font-size:16px
  }

  .flight-row{
    gap:10px
  }

  .flight-route strong{
    font-size:12px
  }

  .flight-route strong span{
    margin:0 8px
  }

  .flight-meta strong{
    font-size:10px
  }

  .flight-row small{
    font-size:8px
  }

  .leaderboard-banner{
    padding:24px 20px;
    gap:17px
  }

  .leaderboard-banner>span{
    font-size:40px
  }

  .leaderboard-banner h2{
    font-size:20px;
    line-height:1.4
  }

  .leaderboard-banner p{
    font-size:10px;
    line-height:1.8
  }

  .page-heading>.button{
    font-size:9px;
    gap:10px;
    padding:10px;
    min-height:34px
  }

  .airport-card{
    gap:10px
  }

  .airport-card>.pill{
    font-size:6px
  }

  .airport-card>strong{
    font-size:18px;
    min-width:45px
  }

  footer{
    font-size:6px;
    gap:10px;
    line-height:1.7
  }

  footer>span:last-child{
    text-align:right
  }

  .footer-divider{
    padding:0 7px
  }

  .auth-modal{
    padding:29px 24px
  }

  .auth-modal h2{
    font-size:23px
  }

  .modal-backdrop{
    padding:16px
  }

  .alert{
    font-size:11px
  }
}

@media(prefers-reduced-motion:reduce){
  *{
    scroll-behavior:auto!important;
    transition:none!important
  }
}

.auth-dialog{
  border:0;
  background:transparent;
  color:inherit;
  padding:25px;
  margin:0;
  width:100vw;
  max-width:100vw;
  height:100dvh;
  max-height:100dvh
}

.auth-dialog[open]{
  display:flex;
  align-items:center;
  justify-content:center
}

.auth-dialog::backdrop{
  background:#0d192bc4;
  -webkit-backdrop-filter:blur(5px);
          backdrop-filter:blur(5px)
}

@media(max-width:640px){
  .auth-dialog{
    padding:16px
  }
}

.flight-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-shrink:0
}

.flight-action{
  border:1px solid #d5dce2;
  background:#fff;
  color:#37485a;
  border-radius:4px;
  padding:6px 9px;
  font:inherit;
  font-size:10px;
  cursor:pointer
}

.flight-action:hover:not(:disabled){
  border-color:#e8845a;
  color:#a54425
}

.flight-action:disabled{
  opacity:.55;
  cursor:wait
}

.flight-confirm{
  display:flex;
  align-items:center;
  gap:8px;
  flex:1 0 100%;
  font-size:11px;
  color:#7c3d2c
}

.flight-edit{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  flex:1 0 100%;
  padding:5px 0 8px
}

.flight-edit label{
  display:block;
  color:#536273;
  font-size:10px;
  font-weight:600
}

.flight-edit input{
  display:block;
  box-sizing:border-box;
  width:100%;
  margin-top:5px;
  border:1px solid #dfe4e8;
  border-radius:4px;
  padding:9px 10px;
  color:#263545;
  font:inherit;
  font-size:12px
}

.flight-edit-actions{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
  gap:8px
}

.flight-edit-actions .button{
  min-height:31px
}

@media(max-width:640px){
  .flight-row{
    flex-wrap:wrap
  }

  .flight-actions{
    margin-left:auto
  }

  .flight-edit{
    grid-template-columns:1fr
  }
}

.route-inputs input,.flight-route strong,.search-result strong{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-variant-numeric:tabular-nums
}

.route-inputs>span{
  color:#158b78
}
