
      :root, :root[data-theme] {
        color-scheme: dark;
        --x-jade: #2BD9A8; --x-gold: #F0B90B; --x-violet: #8B6CFF; --x-sky: #5AB8FF; --x-ash: #5f6d69;
        --x-bg: #060908; --x-panel: #0d1311; --x-line: rgb(43 217 168 / 0.34);
        --x-mono: "Geist Mono", ui-monospace, monospace;
        --fill-primary-on: #060908; --text-primary: #EEF5F2; --text-secondary: #9DB0A9; --text-tertiary: #EEF5F24d;
        --fill-primary: #2BD9A8; --text-primary-on: #04140F; --fill-tertiary: #111816;
        --stroke-primary: rgb(43 217 168 / 0.3); --stroke-secondary: #EEF5F214; --hover-wash: #EEF5F20f;
        --hark-shadow: 0 10px 40px rgb(0 0 0 / 0.55);
      }
      body { background: var(--x-bg); }
      body::before, body::after { content: ""; position: fixed; z-index: -1; pointer-events: none; }
      body::before {
        inset: 0;
        background:
          radial-gradient(circle at 12% 18%, rgb(238 245 242 / 0.5) 0 1px, transparent 1.6px) 0 0 / 230px 230px,
          radial-gradient(circle at 64% 72%, rgb(240 185 11 / 0.45) 0 1px, transparent 1.6px) 0 0 / 310px 310px,
          radial-gradient(circle at 38% 52%, rgb(139 108 255 / 0.5) 0 1px, transparent 1.6px) 0 0 / 420px 420px,
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66v34' fill='none' stroke='%232BD9A8' stroke-opacity='.07'/%3E%3C/svg%3E");
      }
      body::after {
        width: 70vmax; height: 70vmax; left: -15vmax; top: -20vmax; border-radius: 50%;
        background: radial-gradient(closest-side, rgb(43 217 168 / 0.13), rgb(139 108 255 / 0.06) 55%, transparent);
        animation: x-drift 48s ease-in-out infinite alternate;
      }
      @keyframes x-drift { to { transform: translate(55vw, 70vh); } }
      @media (prefers-reduced-motion: reduce) { body::after { animation: none; } }

      /* chamfered card with a thin glowing border */
      .x-ch { --c: 16px; position: relative; padding: 22px; background-color: var(--x-panel);
        background-image: radial-gradient(120% 80% at 50% 0%, rgb(43 217 168 / 0.07), transparent 60%);
        clip-path: polygon(var(--c) 0, calc(100% - var(--c)) 0, 100% var(--c), 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, var(--c) 100%, 0 calc(100% - var(--c)), 0 var(--c)); }
      .x-ch::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: var(--x-line);
        clip-path: polygon(evenodd, var(--c) 0, calc(100% - var(--c)) 0, 100% var(--c), 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, var(--c) 100%, 0 calc(100% - var(--c)), 0 var(--c), var(--c) 0,
          calc(var(--c) + 0.4px) 1px, 1px calc(var(--c) + 0.4px), 1px calc(100% - var(--c) - 0.4px), calc(var(--c) + 0.4px) calc(100% - 1px), calc(100% - var(--c) - 0.4px) calc(100% - 1px), calc(100% - 1px) calc(100% - var(--c) - 0.4px), calc(100% - 1px) calc(var(--c) + 0.4px), calc(100% - var(--c) - 0.4px) 1px, calc(var(--c) + 0.4px) 1px); }
      .x-ch--v { --x-line: rgb(240 185 11 / 0.7); background-image: radial-gradient(120% 70% at 50% 0%, rgb(240 185 11 / 0.24), transparent 70%); }
      .x-ch--mute { --x-line: rgb(238 245 242 / 0.14); }
      .x-glow { filter: drop-shadow(0 0 18px rgb(43 217 168 / 0.22)); }
      .x-vglow { filter: drop-shadow(0 0 22px rgb(240 185 11 / 0.35)); }
      .x-hex { position: relative; display: grid; place-items: center; text-align: center; background-color: var(--x-panel);
        clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); }
      .x-hex::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: var(--x-line);
        clip-path: polygon(evenodd, 25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%, 25% 0,
          calc(25% + 1px) 1.5px, 1.5px 50%, calc(25% + 1px) calc(100% - 1.5px), calc(75% - 1px) calc(100% - 1.5px), calc(100% - 1.5px) 50%, calc(75% - 1px) 1.5px, calc(25% + 1px) 1.5px); }

      /* nav */
      .x-nav { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 12px); z-index: 20; justify-self: center; max-width: 100%;
        display: flex; align-items: center; gap: 6px; padding: 5px 5px 5px 16px; border-radius: var(--r-pill);
        background: rgb(8 13 12 / 0.62); -webkit-backdrop-filter: var(--hark-blur); backdrop-filter: var(--hark-blur);
        border: 1px solid var(--x-line); box-shadow: var(--hark-shadow), 0 0 24px rgb(43 217 168 / 0.12); }
      .x-brand { display: inline-flex; align-items: center; gap: 8px; min-height: var(--tap); margin-right: 6px; color: var(--text-primary);
        text-decoration: none; font: var(--weight-medium) var(--size-label)/1 var(--sans); letter-spacing: 0.18em; white-space: nowrap; }
      .x-panel { display: flex; align-items: center; gap: 6px; }
      .x-links { display: flex; }
      .x-links a { display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 10px; border-radius: var(--r-pill);
        font: var(--type-small); color: var(--text-secondary); text-decoration: none; white-space: nowrap; }
      .x-links a:hover { color: var(--x-jade); background: var(--hover-wash); }
      .x-langs { display: flex; gap: 2px; padding: 2px; border-radius: var(--r-pill); background: #141c1a; }
      .x-langs button, .x-menu { min-width: var(--tap); min-height: var(--tap); padding: 0 10px; border: 0; border-radius: var(--r-pill);
        background: none; color: var(--text-secondary); font: var(--type-tag); cursor: pointer; }
      .x-langs button[aria-pressed="true"] { background: var(--x-jade); color: var(--text-primary-on); }
      .x-menu { display: none; color: var(--text-primary); font-size: var(--size-heading); }
      .btn.x-pill { min-height: var(--tap); padding: 0 18px; border-radius: var(--r-pill); justify-content: center; white-space: nowrap; }
      .btn.x-out { background: transparent; color: var(--x-jade); border-color: var(--x-jade); }
      .btn.x-out:hover { box-shadow: inset 0 0 0 100px rgb(43 217 168 / 0.12), 0 0 16px rgb(43 217 168 / 0.3); }
      .btn.x-solid { background: var(--x-jade); color: var(--text-primary-on); border-color: var(--x-jade); box-shadow: 0 0 20px rgb(43 217 168 / 0.35); }
      .btn:disabled { opacity: 0.5; cursor: not-allowed; box-shadow: none; }
      @media (max-width: 1080px) {
        .x-menu { display: inline-flex; align-items: center; justify-content: center; }
        .x-panel { display: none; position: absolute; top: calc(100% + 8px); left: 0; right: 0; flex-direction: column; align-items: stretch;
          padding: 10px; border-radius: var(--r-l); background: rgb(8 13 12 / 0.95); -webkit-backdrop-filter: var(--hark-blur); backdrop-filter: var(--hark-blur);
          border: 1px solid var(--x-line); box-shadow: var(--hark-shadow); }
        .x-nav { width: min(100%, 520px); }
        .x-nav.is-open .x-panel { display: flex; }
        .x-links { flex-direction: column; }
        .x-links a { font: var(--type-body); padding: 0 12px; border-radius: var(--r-s); }
        .x-langs { align-self: flex-start; }
        .x-brand { margin-right: auto; }
      }

      /* hero */
      .x-hero { display: grid; justify-items: center; gap: 16px; text-align: center; padding-top: clamp(40px, 7vw, 84px); scroll-margin-top: 80px; }
      .x-label { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border: 1px solid var(--x-line); border-radius: var(--r-pill);
        font: var(--type-tag); color: var(--x-jade); background: #0b1714; }
      .x-hero h1 { font: var(--weight-bold) clamp(52px, 12vw, 136px)/0.95 var(--sans); letter-spacing: 0.08em; margin-right: -0.08em;
        color: #EEF5F2; text-shadow: 0 0 28px rgb(43 217 168 / 0.45), 0 0 2px rgb(240 185 11 / 0.4); }
      .x-tagline { font: var(--type-heading); max-width: 32ch; }
      .x-sub { font: var(--type-body); color: var(--text-secondary); max-width: 54ch; }
      .x-hero .links { justify-content: center; margin-top: 6px; }
      .x-frame { width: 100%; margin-top: clamp(24px, 4vw, 44px); }
      .x-frame .x-ch { --c: 32px; padding: 8px; }
      .x-frame img { display: block; width: 100%; height: auto; clip-path: polygon(26px 0, calc(100% - 26px) 0, 100% 26px, 100% calc(100% - 26px), calc(100% - 26px) 100%, 26px 100%, 0 calc(100% - 26px), 0 26px); }
      .x-badges { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: clamp(-80px, -7vw, -40px); width: 100%; }
      .x-badges .x-hex { width: clamp(132px, 15vw, 168px); aspect-ratio: 1.155; padding: 0 20%; align-content: center; gap: 2px; }
      .x-badges b { font: var(--type-figure); color: var(--x-gold); }
      .x-badges span { font: var(--type-caption); color: var(--text-secondary); }
      .x-hero .fineprint { margin-top: 8px; }
      @media (max-width: 640px) { .x-badges { margin-top: 16px; } .x-badges .x-hex { width: calc(50% - 6px); max-width: 168px; } }

      /* section + divider */
      .x-sec { padding-block: clamp(44px, 7vw, 84px) 8px; scroll-margin-top: 80px; min-width: 0; }
      .x-sec::before, .x-foot::before { content: ""; display: block; height: 18px; margin-bottom: clamp(36px, 5vw, 60px);
        background:
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='18'%3E%3Crect width='40' height='18' fill='%23060908'/%3E%3Cpath d='M15 2h10l5 7-5 7H15l-5-7z' fill='%232BD9A8' fill-opacity='.15' stroke='%232BD9A8'/%3E%3C/svg%3E") center / 40px 18px no-repeat,
          linear-gradient(90deg, transparent, var(--x-line) 25%, var(--x-line) 75%, transparent) center / 100% 1px no-repeat; }
      .x-head { display: grid; justify-items: center; gap: 8px; text-align: center; margin-bottom: clamp(28px, 4vw, 44px); }
      .x-eyebrow { font: var(--type-tag); letter-spacing: 0.16em; text-transform: uppercase; color: var(--x-jade); }
      .x-head h2 { font: var(--type-title); }
      .x-head p:not(.x-eyebrow) { color: var(--text-secondary); max-width: 52ch; }
      .x-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: stretch; }
      .x-mt { margin-top: 20px; }
      @media (max-width: 760px) { .x-two { grid-template-columns: minmax(0, 1fr); } }
      .x-h3 { font: var(--type-label); margin-bottom: 14px; }

      /* summoning altar */
      .x-altar { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: center; padding: clamp(22px, 4vw, 40px); }
      .x-ring { --p: 0; position: relative; width: clamp(190px, 22vw, 240px); aspect-ratio: 1; display: grid; place-content: center; justify-items: center; gap: 6px; text-align: center; }
      .x-ring::before { content: ""; position: absolute; inset: 0; border-radius: 50%;
        background: conic-gradient(var(--x-jade) calc(var(--p) * 1%), rgb(238 245 242 / 0.08) 0);
        -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 10px), #000 calc(100% - 9px)); mask: radial-gradient(farthest-side, transparent calc(100% - 10px), #000 calc(100% - 9px));
        box-shadow: 0 0 40px rgb(43 217 168 / 0.25); }
      .x-ring b { font: var(--type-display); color: var(--x-gold); line-height: 1; }
      .x-ring small { font: var(--type-small); font-family: var(--x-mono); color: var(--text-secondary); }
      .x-rows { margin: 0; }
      .x-rows div { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--stroke-secondary); font: var(--type-small); }
      .x-rows dt { color: var(--text-secondary); }
      .x-rows dd { margin: 0; text-align: right; font-weight: var(--weight-medium); }
      .x-buy { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 18px; }
      .x-step { display: inline-flex; align-items: center; border: 1px solid var(--x-line); border-radius: var(--r-pill); }
      .x-step button { min-width: var(--tap); min-height: var(--tap); border: 0; background: none; color: var(--text-secondary); font: var(--type-label); }
      .x-step button:disabled { opacity: 0.5; cursor: not-allowed; }
      .x-step output { min-width: 22px; text-align: center; font: var(--type-label); font-family: var(--x-mono); }
      .x-rules { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
      .x-rules li { --c: 7px; padding: 9px 14px 9px 12px; display: flex; align-items: center; gap: 8px; font: var(--type-small); }
      .x-rules i { font-style: normal; color: var(--x-jade); }
      @media (max-width: 720px) { .x-altar { grid-template-columns: minmax(0, 1fr); } .x-ring { justify-self: center; } }

      /* evolution path */
      .x-path { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
      .x-path::before { content: ""; position: absolute; top: 37px; left: 12.5%; right: 12.5%; height: 2px;
        background: linear-gradient(90deg, var(--x-jade), var(--x-violet) 66%, var(--x-gold)); box-shadow: 0 0 14px rgb(43 217 168 / 0.6); }
      .x-path li { display: grid; justify-items: center; align-content: start; gap: 8px; text-align: center; }
      .x-path .x-hex { width: 86px; aspect-ratio: 1.155; font: var(--type-label); font-family: var(--x-mono); color: var(--x-jade); }
      .x-path li:last-child .x-hex { --x-line: var(--x-gold); color: var(--x-gold); }
      .x-path h3 { font: var(--weight-medium) var(--size-label)/1.2 var(--sans); letter-spacing: 0.16em; color: var(--x-gold); margin-top: 6px; }
      .x-path p { font: var(--type-small); color: var(--text-secondary); max-width: 28ch; }
      @media (max-width: 760px) {
        .x-path { grid-template-columns: minmax(0, 1fr); gap: 20px; }
        .x-path::before { top: 37px; bottom: 37px; left: 42px; right: auto; width: 2px; height: auto; background: linear-gradient(180deg, var(--x-jade), var(--x-violet) 66%, var(--x-gold)); }
        .x-path li { grid-template-columns: 86px minmax(0, 1fr); justify-items: start; column-gap: 16px; row-gap: 2px; text-align: left; }
        .x-path .x-hex { grid-row: span 2; }
        .x-path h3 { margin-top: 18px; }
      }

      /* classes */
      .x-art { --c: 24px; padding: 8px; }
      .x-art img { display: block; width: 100%; height: auto; }
      .x-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; align-content: start; }
      .x-chips li { --c: 8px; padding: 10px 12px; display: grid; grid-template-columns: 8px minmax(0, 1fr); column-gap: 10px; align-items: baseline; font: var(--type-small); }
      .x-chips li span { grid-column: 2; font: var(--type-caption); color: var(--text-secondary); }
      .x-d { width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: var(--x-ash); box-shadow: 0 0 8px currentColor; color: var(--x-ash); }
      .x-d[data-k="m"] { background: var(--x-gold); color: var(--x-gold); }
      .x-d[data-k="i"] { background: var(--x-jade); color: var(--x-jade); }
      .x-d[data-k="v"] { background: var(--x-violet); color: var(--x-violet); }
      .x-d[data-k="n"] { background: var(--x-sky); color: var(--x-sky); }
      .x-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 14px 0 0; padding: 0; list-style: none; font: var(--type-caption); color: var(--text-secondary); }
      .x-legend li { display: inline-flex; align-items: center; gap: 6px; }

      /* ascension */
      .x-stages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
      .x-stage { min-height: 300px; height: 100%; display: grid; align-content: space-between; gap: 20px; padding: 26px; }
      .x-stage__n { font: var(--type-caption); font-family: var(--x-mono); letter-spacing: 0.2em; color: var(--x-jade); }
      .x-stage h3 { font: var(--type-heading); margin-top: 8px; }
      .x-stage dl { margin: 0; display: grid; gap: 12px; }
      .x-stage dt { font: var(--type-caption); color: var(--text-secondary); }
      .x-stage dd { margin: 0; font: var(--type-small); }
      .x-ch--v .x-stage__n, .x-ch--v h3 { color: var(--x-gold); }
      @media (max-width: 760px) { .x-stages { grid-template-columns: minmax(0, 1fr); } .x-stage { min-height: 0; } }
      .x-seg { display: flex; gap: 3px; height: 16px; }
      .x-seg i { border-radius: 2px; }
      .x-key { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; margin: 16px 0 12px; padding: 0; list-style: none; }
      .x-key li { display: flex; align-items: center; gap: 8px; font: var(--type-small); }
      .x-key b { margin-left: auto; font-family: var(--x-mono); font-weight: var(--weight-regular); }
      .x-sw { width: 10px; height: 10px; border-radius: 2px; flex: none; }

      /* hiring hall */
      .x-fee { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; }
      .x-donut { position: relative; width: 180px; aspect-ratio: 1; display: grid; place-content: center; text-align: center; flex: none; }
      .x-donut::before { content: ""; position: absolute; inset: 0; border-radius: 50%;
        background: conic-gradient(var(--x-gold) 0 50%, var(--x-jade) 0 80%, var(--x-ash) 0);
        -webkit-mask: radial-gradient(farthest-side, transparent 62%, #000 63%); mask: radial-gradient(farthest-side, transparent 62%, #000 63%); }
      .x-donut b { font: var(--type-heading); }
      .x-donut span { font: var(--type-caption); color: var(--text-secondary); }
      .x-fee .x-key { grid-template-columns: minmax(0, 1fr); flex: 1 1 180px; margin: 0; }
      .x-empty { display: grid; justify-items: center; align-content: center; gap: 10px; text-align: center; }
      .x-empty svg { width: 120px; height: auto; }
      .x-empty b { font: var(--type-label); }
      .x-filters { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 6px; }
      .x-filters select { min-height: var(--tap); padding: 0 14px; border-radius: var(--r-pill); border: 1px solid var(--stroke-secondary);
        background: transparent; color: var(--text-secondary); font: var(--type-small); opacity: 0.7; }

      /* ledger */
      .x-ledger { padding: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
      .x-ledger > div { padding: clamp(20px, 3vw, 32px); }
      .x-ledger > div + div { border-left: 1px solid var(--stroke-secondary); }
      .x-entries { margin: 0; display: grid; }
      .x-entries > div { padding: 14px 0; border-bottom: 1px solid var(--stroke-secondary); display: grid; gap: 6px; }
      .x-entries > div:last-child { border-bottom: 0; }
      .x-entries dt, .x-ltitle { font: var(--type-caption); font-family: var(--x-mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--x-jade); }
      .x-entries dd { margin: 0; font: var(--type-small); }
      .x-entries dd + dd { color: var(--text-secondary); }
      .x-acc details { border-bottom: 1px solid var(--stroke-secondary); }
      .x-acc summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: var(--tap); padding: 8px 0; cursor: pointer; list-style: none; font: var(--type-small); font-weight: var(--weight-medium); }
      .x-acc summary::-webkit-details-marker { display: none; }
      .x-acc summary::after { content: "+"; font: var(--type-label); color: var(--x-jade); transition: transform var(--dur-quick) var(--ease-out); }
      .x-acc details[open] summary::after { transform: rotate(45deg); }
      .x-acc p { padding: 0 0 14px; font: var(--type-small); color: var(--text-secondary); }
      .x-ltitle { margin-bottom: 6px; }
      @media (max-width: 760px) { .x-ledger { grid-template-columns: minmax(0, 1fr); } .x-ledger > div + div { border-left: 0; border-top: 1px solid var(--stroke-secondary); } }

      /* quest log */
      .x-quests { margin: 0; padding: 6px clamp(16px, 3vw, 28px); list-style: none; }
      .x-quests li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 14px 0; border-bottom: 1px solid var(--stroke-secondary); }
      .x-quests li:last-child { border-bottom: 0; }
      .x-box { width: 16px; height: 18px; flex: none; background: var(--x-line); clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
      .x-quests .is-now .x-box { background: var(--x-jade); box-shadow: 0 0 10px var(--x-jade); }
      .x-day { --c: 6px; padding: 5px 10px; min-width: 104px; text-align: center; font: var(--type-caption); font-family: var(--x-mono); color: var(--x-jade); }
      .x-task { flex: 1 1 200px; font: var(--type-small); }
      .x-tag { padding: 4px 12px; border-radius: var(--r-pill); border: 1px solid var(--stroke-secondary); font: var(--type-tag); color: var(--text-secondary); white-space: nowrap; }
      .x-tag--ip { background: var(--x-jade); border-color: var(--x-jade); color: var(--text-primary-on); }
      .x-tag--dn { border-color: rgb(43 217 168 / .5); color: #2BD9A8; }
      .x-tag--nx { border-color: #F0B90B; color: #F0B90B; }
      .x-quests .is-done .x-box { background: rgb(43 217 168 / .45); }
      .x-tag--lt { border-color: rgb(139 108 255 / 0.6); color: #b9a8ff; }

      /* footer + toast */
      .x-foot { display: grid; justify-items: center; gap: 14px; text-align: center; padding-block: clamp(40px, 6vw, 72px) 8px; font: var(--type-small); color: var(--text-secondary); }
      .x-foot p { max-width: 60ch; }
      .x-foot .links { justify-content: center; }
      .x-toast { position: fixed; left: 50%; bottom: 24px; z-index: 50; transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
        padding: 12px 20px; border-radius: var(--r-pill); background: var(--x-jade); color: var(--text-primary-on); font: var(--type-label);
        box-shadow: var(--hark-shadow); transition: opacity var(--dur-quick) var(--ease-out), transform var(--dur-quick) var(--ease-out); }
      .x-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
    
.mk-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:8px 0 14px}
.mk-stats div{border:1px solid rgb(43 217 168 / .3);border-radius:14px;padding:12px;text-align:center}
.mk-stats b{display:block;font-size:20px;color:#F0B90B}.mk-stats span{font-size:12px;opacity:.7}
.mk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:12px 0}
.mk-card{border:1px solid rgb(43 217 168 / .25);border-radius:14px;overflow:hidden;background:rgb(255 255 255 / .03)}
.mk-card img{width:100%;aspect-ratio:1;display:block;image-rendering:pixelated;background:#0b1512}
.mk-card .mk-b{padding:8px 10px;font-size:13px}.mk-card .mk-b b{display:block}
.mk-card .mk-r{font-size:11px;opacity:.75}.mk-card .mk-p{color:#F0B90B;font-weight:700;margin:4px 0}
.mk-card button,.mk-card input{width:100%;margin-top:6px;box-sizing:border-box}
.mk-card input{padding:7px;border-radius:8px;border:1px solid #23413a;background:#fff;color:#111}
