/*
  1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
  2. Remove default margins and padding
  3. Reset all borders.
*/

*,
::after,
::before,
::backdrop,
::file-selector-button {
  box-sizing: border-box; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 2 */
  border: 0 solid; /* 3 */
}

/*
  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 */
  tab-size: 4; /* 3 */
  font-family: --theme(
    --default-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: --theme(--default-font-feature-settings, normal); /* 5 */
  font-variation-settings: --theme(--default-font-variation-settings, normal); /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
  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. Reset the default border style to a 1px solid border.
*/

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;
  -webkit-text-decoration: 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: --theme(
    --default-mono-font-family,
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    'Liberation Mono',
    'Courier New',
    monospace
  ); /* 1 */
  font-feature-settings: --theme(--default-mono-font-feature-settings, normal); /* 2 */
  font-variation-settings: --theme(--default-mono-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 */
}

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

:-moz-focusring {
  outline: auto;
}

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

progress {
  vertical-align: baseline;
}

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

summary {
  display: list-item;
}

/*
  Make lists unstyled by default.
*/

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

/*
  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;
}

/*
  1. Inherit font styles in all browsers.
  2. Remove border radius in all browsers.
  3. Remove background color in all browsers.
  4. Ensure consistent opacity for disabled states in all browsers.
*/

button,
input,
select,
optgroup,
textarea,
::file-selector-button {
  font: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  border-radius: 0; /* 2 */
  background-color: transparent; /* 3 */
  opacity: 1; /* 4 */
}

/*
  Restore default font weight.
*/

:where(select:is([multiple], [size])) optgroup {
  font-weight: bolder;
}

/*
  Restore indentation.
*/

:where(select:is([multiple], [size])) optgroup option {
  padding-inline-start: 20px;
}

/*
  Restore space after button.
*/

::file-selector-button {
  margin-inline-end: 4px;
}

/*
  Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
*/

::placeholder {
  opacity: 1;
}

/*
  Set the default placeholder color to a semi-transparent version of the current text color in browsers that do not
  crash when using `color-mix(…)` with `currentcolor`. (https://github.com/tailwindlabs/tailwindcss/issues/17194)
*/

@supports (not (-webkit-appearance: -apple-pay-button)) /* Not Safari */ or
  (contain-intrinsic-size: 1px) /* Safari 17+ */ {
  ::placeholder {
    color: color-mix(in oklab, currentcolor 50%, transparent);
  }
}

/*
  Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

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

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

/*
  1. Ensure date/time inputs have the same height when empty in iOS Safari.
  2. Ensure text alignment can be changed on date/time inputs in iOS Safari.
*/

::-webkit-date-and-time-value {
  min-height: 1lh; /* 1 */
  text-align: inherit; /* 2 */
}

/*
  Prevent height from changing on date/time inputs in macOS Safari when the input is set to `display: block`.
*/

::-webkit-datetime-edit {
  display: inline-flex;
}

/*
  Remove excess padding from pseudo-elements in date/time inputs to ensure consistent height across browsers.
*/

::-webkit-datetime-edit-fields-wrapper {
  padding: 0;
}

::-webkit-datetime-edit,
::-webkit-datetime-edit-year-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-minute-field,
::-webkit-datetime-edit-second-field,
::-webkit-datetime-edit-millisecond-field,
::-webkit-datetime-edit-meridiem-field {
  padding-block: 0;
}

/*
  Center dropdown marker shown on inputs with paired `<datalist>`s in Chrome. (https://github.com/tailwindlabs/tailwindcss/issues/18499)
*/

::-webkit-calendar-picker-indicator {
  line-height: 1;
}

/*
  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;
}

/*
  Correct the inability to style the border radius in iOS Safari.
*/

button,
input:where([type='button'], [type='reset'], [type='submit']),
::file-selector-button {
  appearance: button;
}

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

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

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

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

.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

:root{color-scheme:dark;--bg:#102323;--panel:#102626f2;--line:#cee0ce22;--ink:#f0eee2;--muted:#a2b3a8;--gold:#e4bc70;--teal:#8ad4b9}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Tahoma,Arial,sans-serif;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer;border:0;color:inherit;transition:background .15s,transform .15s}button:disabled{cursor:default;opacity:.6}button:not(:disabled):active{transform:translateY(1px)}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}input,select{min-width:0;width:100%;height:46px;border:1px solid var(--line);background:#0b2021;color:var(--ink);border-radius:10px;padding:0 12px}input[type=number]{direction:ltr;text-align:right}input[type=checkbox]{width:18px;height:18px;accent-color:var(--gold)}input::placeholder{color:#80988f;font-size:13px}h1,h2,h3,p{margin:0}h2{font-size:22px;font-weight:500;line-height:1.6}h3{font-size:16px;font-weight:500;margin-bottom:15px}.field{display:grid;gap:9px;margin-bottom:18px}.field>span{font-size:12px;color:var(--muted)}.primary,.secondary{min-height:43px;padding:10px 18px;border-radius:10px;width:100%;text-align:center}.primary{background:var(--gold);color:#18342e;font-weight:bold}.primary:hover:not(:disabled){background:#f0cf8c}.secondary{background:#28413b;border:1px solid var(--line)}.secondary:hover:not(:disabled){background:#36534a}.eyebrow{color:var(--gold);font-size:11px;margin-bottom:10px;line-height:1.8}.subtle{color:var(--muted);font-size:12px;line-height:1.9}.error{background:#b5644724;color:#ffd1b7;font-size:13px;line-height:1.8;padding:12px;border-radius:10px}.error button{display:block;margin-top:12px;background:var(--gold);color:#102323;padding:8px 16px;border-radius:8px}.boot{height:100dvh;display:grid;place-items:center}.spinner{display:block;width:31px;height:31px;border:2px solid #d9c59433;border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.login-page{width:100%;height:100dvh;display:flex;align-items:center;padding:6vw;background:linear-gradient(90deg,#0b222322,#0b2223bb 62%,#0b2223ef);isolation:isolate}.login-city{position:absolute;inset:0;background:url('/city.jpg') center/cover;z-index:-2}.login-page:after{content:'';position:absolute;inset:0;background:linear-gradient(270deg,#102323e8 0%,#102323b8 38%,#10232314 100%);z-index:-1}.login-card{width:410px;padding:38px;border:1px solid #f3dfb735;border-radius:24px;background:#102626e8;box-shadow:0 30px 100px #05181966;backdrop-filter:blur(18px)}.brand-mark{color:var(--gold);font-size:38px;margin-bottom:22px;line-height:1}.login-card h1{font-size:34px;line-height:1.5;font-weight:500}.login-copy{font-size:13px;line-height:2;color:#c5cec1;margin:12px 0 28px}.login-button{display:flex;align-items:center;justify-content:space-between;margin-top:24px;height:48px}.login-note{font-size:10px;color:var(--muted);text-align:center;margin-top:22px;line-height:1.8}
.game-shell{position:relative;width:100%;height:100dvh;overflow:hidden;background:#bca17a}#city-canvas{width:100%;height:100%;display:block;touch-action:none}.wallet-hud{position:absolute;top:22px;right:24px;display:flex;gap:9px;max-width:calc(100% - 48px);direction:rtl}.wallet-card{min-width:142px;height:64px;padding:10px 13px;display:flex;align-items:center;gap:12px;border-radius:14px;background:#102b29eb;border:1px solid #e4d4aa2a;box-shadow:0 6px 22px #1023231f;backdrop-filter:blur(15px);text-align:right}.wallet-card:disabled{opacity:1}.wallet-card:not(:disabled):hover{background:#1d3c35}.wallet-card>svg{width:34px;height:34px;flex-shrink:0}.wallet-card span:not(.riyal){display:flex;flex-direction:column;gap:5px}.wallet-card small{font-size:10px;color:#c7c9b6}.wallet-card strong{font-size:17px;font-weight:500;font-variant-numeric:tabular-nums}.wallet-card.gold strong{color:#f0c36f}.wallet-card.stocks strong{color:#96dabb}.riyal{height:31px;width:31px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#e8dfbf;flex-shrink:0}.riyal img{height:22px;width:20px;object-fit:contain}.session-tools{position:absolute;top:29px;left:24px;display:flex;align-items:center;gap:8px;direction:rtl}.name-pill{font-size:12px;padding:10px 14px;background:#102b29df;border-radius:10px;display:flex;gap:9px;align-items:center}.name-pill b{font-size:10px;font-weight:normal;color:var(--gold)}.logout{background:#102b29d9;border-radius:10px;width:34px;height:34px;font-size:20px}.admin-open{padding:10px 15px;border-radius:10px;background:var(--gold);color:#18342e;font-size:12px}.market-paused{position:absolute;top:100px;right:24px;padding:10px 18px;border-radius:10px;background:#58482aed;color:#ffe3ad;font-size:12px}.world-loading{position:absolute;inset:0;z-index:4;background:#102323ee;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px}.world-loading h2{font-size:20px}.world-loading p{font-size:12px;color:var(--muted)}.world-loading .error{max-width:500px;overflow-wrap:anywhere}.progress{width:240px;height:4px;background:#bfa46833;border-radius:3px;overflow:hidden;direction:ltr}.progress i{display:block;height:100%;background:var(--gold)}
.property-sheet,.market-sheet,.portfolio-sheet{position:absolute;bottom:25px;right:24px;width:365px;max-height:calc(100dvh - 130px);overflow-y:auto;padding:26px;border-radius:20px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(20px);box-shadow:0 12px 60px #071c2355}.close{position:absolute;left:12px;top:11px;display:grid;place-items:center;width:30px;height:30px;font-size:23px;border-radius:50%;background:#e9e4cd10;color:#c7d0c3}.close:hover{background:#e9e4cd22}.property-sheet h2{margin-bottom:19px;padding-left:12px}.property-facts{display:flex;flex-wrap:wrap;gap:18px;padding:17px 0 22px;line-height:1.5}.property-facts>span{font-size:10px;color:var(--muted);display:grid;gap:7px;flex:1;min-width:65px}.property-facts strong{font-size:14px;font-weight:500;color:var(--ink);white-space:nowrap}.inline-riyal{height:13px;width:12px;object-fit:contain;filter:invert(1)}.ownership-badge{display:block;color:var(--teal);font-size:12px;padding-bottom:17px}.listing-row{display:flex;gap:8px;margin-bottom:11px}.listing-row input{flex:1}.listing-row button{font-size:12px;background:#365346;border-radius:10px;padding:0 12px}.property-sheet .secondary{margin-top:8px;font-size:12px}.action-pair{display:flex;gap:10px;margin-top:10px}.action-pair>*{flex:1}.market-sheet>svg{width:48px;height:48px;margin-bottom:9px}.portfolio-sheet{width:390px}.portfolio-sheet h2{margin-bottom:22px}.item-list{max-height:50dvh;overflow:auto}.property-item{width:100%;padding:15px 0;display:flex;align-items:center;justify-content:space-between;gap:10px;background:none;text-align:right;border-bottom:1px solid var(--line);font-size:13px}.property-item:hover{color:var(--gold)}.property-item span{display:grid;gap:8px}.property-item small{font-size:10px;color:var(--muted)}.property-item strong{font-weight:400;color:var(--gold);font-size:12px}.empty{color:var(--muted);font-size:13px;text-align:center;line-height:2;padding:35px 10px}
.admin-panel{position:absolute;top:108px;bottom:24px;right:24px;width:min(810px,calc(100% - 48px));display:flex;flex-direction:column;background:#102626fa;border:1px solid var(--line);border-radius:20px;box-shadow:0 12px 80px #061c2966;backdrop-filter:blur(20px)}.admin-panel>header{position:relative;padding:24px 27px 16px;border-bottom:1px solid var(--line)}.admin-panel>header .eyebrow{margin-bottom:3px}.admin-panel>header .close{top:25px;left:22px}.admin-panel nav{display:flex;gap:7px;padding:14px 22px;border-bottom:1px solid var(--line)}.admin-panel nav button{flex:1;padding:12px 4px;border-radius:9px;font-size:12px;background:#203d36;color:#c9d0bd}.admin-panel nav button.active{background:var(--gold);color:#18342e}.admin-content{padding:24px 27px;overflow-y:auto;flex:1;min-height:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.new-player{padding:20px;background:#1c383180;border:1px solid var(--line);border-radius:13px;margin-bottom:27px}.player-row{border:1px solid var(--line);border-radius:12px;margin-bottom:11px;overflow:hidden}.player-row summary{cursor:pointer;padding:18px;display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:13px}.player-row summary strong{font-size:11px;font-weight:normal;color:var(--muted)}.player-row summary b{font-size:10px;color:#eaa884;padding-right:10px}.player-row form{padding:18px;border-top:1px solid var(--line)}.check{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted);margin:10px 0 21px}.search{margin-bottom:18px}.property-admin-layout{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start}.property-admin-list{max-height:calc(100dvh - 365px);overflow:auto}.property-admin-list button{display:grid;gap:7px;padding:13px;border-radius:9px;background:none;font-size:12px;text-align:right;width:100%;margin-bottom:6px}.property-admin-list button.active,.property-admin-list button:hover{background:#29473c}.property-admin-list small{font-size:9px;color:var(--muted)}.round-card{padding:22px;background:#203d33;border-radius:14px;display:grid;gap:15px;margin-bottom:30px;text-align:center}.round-card>span{font-size:12px;color:var(--muted)}.round-card>strong{font-size:40px;font-weight:normal;color:var(--gold)}.trade-list>div{display:flex;align-items:center;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line);font-size:12px;gap:15px}.trade-list span{display:grid;gap:8px}.trade-list small{color:var(--muted);font-size:10px}.trade-list strong{font-weight:normal;color:var(--gold)}.modal-backdrop{position:absolute;inset:0;background:#061c248c;z-index:10;display:grid;place-items:center;padding:20px;backdrop-filter:blur(6px)}.secret-modal{position:relative;padding:35px;width:min(480px,100%);background:#18362e;border:1px solid var(--line);border-radius:20px}.secret-modal h2{font-size:20px;margin-bottom:25px}.secret-modal code{display:block;background:#0c231f;padding:20px 12px;direction:ltr;text-align:center;letter-spacing:2px;color:#f1d390;font-size:18px;border-radius:9px;user-select:all}.secret-modal p:not(.eyebrow){font-size:12px;line-height:2;color:var(--muted);margin:20px 0}.toast{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:20;background:#163b31f5;border:1px solid #c8d6b13b;color:#e3e9cc;padding:15px 25px;border-radius:13px;font-size:13px;max-width:90%;text-align:center;box-shadow:0 12px 45px #071b2366}
@media(max-width:1000px){.wallet-card{min-width:115px;padding:9px;gap:7px}.wallet-card strong{font-size:15px}.session-tools .name-pill{display:none}.admin-open{font-size:11px;padding:10px}.wallet-hud{gap:6px}}
@media(max-width:700px){.login-page{padding:20px;justify-content:center}.login-card{padding:29px;width:min(410px,100%)}.login-card h1{font-size:29px}.wallet-hud{top:14px;right:12px;left:12px;max-width:none;gap:5px}.wallet-card{min-width:0;flex:1;height:61px;padding:7px;gap:6px;border-radius:11px}.wallet-card>svg{width:24px;height:24px}.wallet-card .riyal{width:24px;height:24px}.riyal img{width:16px;height:19px}.wallet-card small{font-size:8px}.wallet-card strong{font-size:12px}.session-tools{left:12px;top:89px;gap:5px}.logout{width:29px;height:29px;font-size:17px;background:#102b29aa}.market-paused{top:89px;right:12px;font-size:10px;padding:8px 12px}.property-sheet,.market-sheet,.portfolio-sheet{left:12px;right:12px;bottom:12px;width:auto;max-height:calc(100dvh - 145px);padding:24px 21px;border-radius:18px}.property-sheet h2{font-size:19px}.property-facts{gap:14px}.admin-panel{top:132px;left:12px;right:12px;bottom:12px;width:auto}.admin-panel>header{padding:16px 18px 10px}.admin-panel h2{font-size:20px}.admin-panel nav{padding:10px;gap:4px}.admin-panel nav button{font-size:10px;padding:11px 2px}.admin-content{padding:17px}.form-grid{gap:0 10px}.property-admin-layout{grid-template-columns:1fr}.property-admin-list{display:flex;max-height:110px;overflow:auto;gap:5px;padding-bottom:8px}.property-admin-list button{min-width:135px;max-width:160px;background:#18382f}.new-player{padding:15px}.player-row summary{padding:15px;font-size:11px}.player-row summary strong{font-size:10px}.secret-modal code{font-size:14px;letter-spacing:1px}.toast{bottom:15px;font-size:12px;width:max-content}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition:none!important}}
@media(max-width:700px){.wallet-card{display:block;position:relative;height:66px}.wallet-card>svg,.wallet-card>.riyal{position:absolute;top:8px;right:7px;width:20px;height:20px}.wallet-card>span:not(.riyal){display:grid;gap:8px}.wallet-card small{padding-right:25px;line-height:18px}.wallet-card strong{font-size:11px;white-space:nowrap}}
