:root{color-scheme:dark}
body.page-market{background:#071522;color:#edf5fc;font-family:Inter,'Segoe UI',Arial,sans-serif}
.page-market .market-main{padding-top:52px;padding-bottom:90px}
.market-eyebrow{font-size:11px;font-weight:800;letter-spacing:.18em;color:#80c9ed}
.market-hero{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:32px;align-items:center;background:linear-gradient(120deg,#102c42,#102238 62%,#122f42);border:1px solid #31516b;border-radius:20px;padding:44px 48px;min-height:280px;box-shadow:0 24px 56px #020a1255}
.market-hero h1{font-size:clamp(42px,5vw,68px);letter-spacing:-.055em;margin:8px 0 12px;line-height:1.05;color:#f3f9ff}
.market-hero p{max-width:680px;color:#b8d0df;font-size:16px;line-height:1.65;margin:0}
.market-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.market-hero-mark{border:1px solid #3b7597;border-radius:18px;background:#112f45;text-align:center;color:#78caeb;font-size:95px;line-height:1;padding:22px 10px;box-shadow:inset 0 0 55px #2c9bc225}
.market-hero-mark small{display:block;font-size:10px;letter-spacing:.22em;font-weight:800;margin-top:12px;color:#bbd8e8}
.market-button{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;border:1px solid #4b6e85;border-radius:9px;background:#18384f;color:#f0f8ff;padding:10px 15px;font:700 13px Inter,'Segoe UI',Arial,sans-serif;text-decoration:none;cursor:pointer;transition:background .16s,border-color .16s}
.market-button:hover{background:#254b64;border-color:#83b8d5;color:white}
.market-button:disabled{opacity:.5;cursor:wait}
.market-primary{background:#70c8ed;border-color:#70c8ed;color:#082034}
.market-primary:hover{background:#a1def5;border-color:#a1def5;color:#082034}
.market-secondary{background:#142e42}
.market-notice{margin:20px 0;padding:14px 18px;border:1px solid #427694;border-radius:10px;background:#173e50;color:#ecf9ff;font-size:14px}
.market-toolbar{display:flex;align-items:end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:34px}
.market-tabs{display:flex;gap:6px;flex-wrap:wrap}
.market-tabs button{appearance:none;border:1px solid #36546a;border-radius:9px;background:#112738;color:#bfd3e1;padding:11px 16px;font:700 13px Inter,'Segoe UI',Arial,sans-serif;cursor:pointer}
.market-tabs button.active{background:#d6edfa;color:#102437;border-color:#d6edfa}
.market-tabs button:hover:not(.active){background:#1d3a50;color:white}
.market-search{display:grid;gap:6px;color:#bfd3e1;font-size:12px;font-weight:700;width:min(100%,320px)}
.market-search input,.market-quantity,.market-price-input{border:1px solid #45677e;border-radius:8px;background:#0c2131;color:#f4f9ff;padding:10px 12px;font:inherit;outline:none}
.market-search input:focus,.market-quantity:focus,.market-price-input:focus{border-color:#89d4f4;box-shadow:0 0 0 3px #7accf328}
.market-summary{display:flex;justify-content:space-between;gap:15px;color:#adc2d1;font-size:12px;margin:18px 0 14px}
.market-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.market-card{display:flex;flex-direction:column;gap:16px;min-width:0;border:1px solid #31526a;border-radius:14px;background:#10283b;padding:20px;box-shadow:0 12px 30px #020c1933}
.market-card-top{display:flex;align-items:flex-start;gap:14px}
.market-item-icon{flex:0 0 54px;width:54px;height:54px;display:grid;place-items:center;border:1px solid #4a829d;border-radius:12px;background:linear-gradient(145deg,#1c5870,#143b53);color:#bcecff;font-size:29px}
.market-card h3{margin:1px 0 5px;font-size:19px;line-height:1.2;overflow-wrap:anywhere;color:#f4f9ff}
.market-card small{color:#b5cbd8;line-height:1.45}
.market-tag{font-size:10px;letter-spacing:.1em;font-weight:800;color:#86d2f0;text-transform:uppercase}
.market-card-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:1px solid #31526a;padding-top:15px}
.market-card-meta div{display:grid;gap:4px}
.market-card-meta span{font-size:11px;color:#adc6d5}
.market-card-meta strong{color:#f2fbff;font-size:15px}
.market-card-actions{display:flex;gap:8px;align-items:center;margin-top:auto}
.market-card-actions .market-button{flex:1;white-space:nowrap}
.market-quantity{width:76px;text-align:center;height:42px}
.market-price-input{min-width:0;width:110px;height:42px}
.market-empty{grid-column:1/-1;border:1px dashed #476780;border-radius:14px;background:#10283b;padding:34px;color:#c0d2de;text-align:center}
.market-orders{margin-top:48px}
.market-section-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:14px}
.market-section-head h2{margin:5px 0 0;color:#f1f8fe;font-size:27px}
.market-order-list{display:grid;gap:9px}
.market-order{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #36586e;background:#10283b;border-radius:10px;padding:14px 17px}
.market-order strong{display:block;color:#eff7fd}
.market-order small{display:block;color:#aec7d5;margin-top:4px}
.market-order-state{font-size:12px;font-weight:800;color:#98dbf5;white-space:nowrap}
.market-order-state.done{color:#9ce1b1}.market-order-state.failed,.market-order-state.review{color:#ffb997}
.market-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:50px}
.market-how>div{border-top:1px solid #456a83;padding:18px 8px 0}
.market-how span{font-size:11px;letter-spacing:.15em;font-weight:800;color:#89d4f4}
.market-how h2{font-size:17px;margin:9px 0 5px;color:#f2f8fe}.market-how p{font-size:13px;color:#b5cbd8;line-height:1.6;margin:0}
.market-dialog{width:min(92vw,480px);border:1px solid #5984a0;border-radius:16px;background:#102b40;color:#f3faff;padding:26px;box-shadow:0 30px 80px #0009}
.market-dialog::backdrop{background:#020b14bb;backdrop-filter:blur(4px)}
.market-dialog h2{color:#f3faff;margin:8px 0}.market-dialog p{color:#c2d9e7}.market-total{font-size:20px;font-weight:800;color:#9de1fa!important}.market-dialog-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:22px}
@media(max-width:1000px){.market-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.market-hero{grid-template-columns:1fr 180px}.market-hero-mark{font-size:70px}}
@media(max-width:700px){.page-market .market-main{padding-top:26px}.market-hero{display:block;padding:29px 24px}.market-hero-mark{display:none}.market-grid,.market-how{grid-template-columns:1fr}.market-toolbar{align-items:stretch}.market-search{width:100%}.market-card{padding:17px}.market-summary{flex-direction:column;gap:3px}}