:root {
  color-scheme: dark;
  --ink: #f5f8ff;
  --muted: #9daec5;
  --line: #273448;
  --blue: #159dff;
  --blue-dark: #1168f2;
  --soft: #0b111b;
  --card: #17202d;
  --green: #44d6a5;
  --shadow: 0 16px 42px rgba(0, 0, 0, .16);
  background: #0b111b;
  color: var(--ink);
}
html { background: #0b111b; }
body { color: var(--ink); background: radial-gradient(circle at 85% 3%, #142f54 0, transparent 28rem), #0b111b; font-size: 14px; }
button, input, select { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid #40baff; outline-offset: 2px; }
[role="button"]:focus-visible { outline: 2px solid #40baff; outline-offset: 3px; }
.sidebar { background: #101722; border-color: var(--line); padding-top: 24px; }
.brand { padding-bottom: 44px; }
.brand-mark { display: block; object-fit: cover; border-radius: 50%; background: #071222; box-shadow: 0 0 0 1px #314760, 0 0 18px #087ee844; letter-spacing: 0; }
.brand-copy strong, .mobile-brand strong { letter-spacing: -.5px; white-space: nowrap; }
.brand-copy strong span, .mobile-brand strong span { color: #21a7ff; }
.brand-copy small, .nav-caption, .side-user small { color: #788da8; }
.nav-item { height: 48px; color: #9aabc0; font-size: 13px; }
.nav-item:hover { background: #172b43; color: #f5f8ff; }
.nav-item.active { background: linear-gradient(100deg,#123b66,#0e3259); color: #39b3ff; box-shadow: inset 3px 0 #16a8ff; }
.nav-item .nav-count { background: #153f6c; color: #7acbff; }
.nav-caption-secondary { padding-top: 28px; }
.side-promo { background: linear-gradient(135deg,#15273c,#171f2e 65%,#432815); border: 1px solid #2b3f53; }
.side-promo:after { border-color: #338bdd44; }
.spark { color: #ff922d; }
.side-promo strong, .side-user strong { font-size: 13px; }
.side-promo p { color: #a5b5c9; font-size: 11px; }
.promo-button, .primary-button { background: linear-gradient(120deg,#14aff9,#1767f5); color: white; box-shadow: 0 7px 20px #0879ed36; }
.promo-button:hover, .primary-button:hover { background: linear-gradient(120deg,#34c3ff,#2679ff); }
.avatar, .top-avatar { object-fit: cover; background: #0d1727; border: 1px solid #36506b; }
.topbar { background: #101722; border-color: var(--line); }
.breadcrumb { color: #92a4b9; font-size: 12px; }
.breadcrumb span { color: #53708e; }
.live-pill { background: #17382f; color: #7de3b8; font-size: 11px; }
.live-pill.idle { background: #2b3140; color: #b9c8db; }
.live-pill.idle span { background: #91a5bb; }
.icon-button { background: #182332; border-color: #2c3b4e; color: #bdcbe0; }
.content { padding-top: 34px; }
.eyebrow { color: #31aaff; font-size: 11px; }
.section-head h1, .page-title { color: #f7f9ff; font-size: clamp(25px,2.4vw,34px); }
.section-head p, .page-subtitle { color: #a4b4c8; font-size: 13px; }
.primary-button, .secondary-button, .ghost-button { min-height: 42px; height: auto; padding: 10px 17px; font-size: 12px; border-radius: 11px; }
.secondary-button { background: #1b314e; color: #6fc9ff; border: 1px solid #2a5280; }
.ghost-button { background: #192331; color: #b6c8de; border: 1px solid #334257; }
.demo-banner { background: #332711; border-color: #7c5720; color: #ffce7b; font-size: 12px; }
.hero { min-height: 230px; border: 1px solid #23558d; background: radial-gradient(circle at 78% 43%,#185a9d 0,#102f55 31%,transparent 53%), linear-gradient(110deg,#11233c,#101926); box-shadow: 0 20px 50px #0003, inset 0 0 50px #1565aa22; }
.hero-copy { padding: 33px; }
.hero-kicker { color: #74caff; opacity: 1; }
.hero h2 { font-size: clamp(23px,2.3vw,32px); }
.hero p { color: #b4cce5; opacity: 1; font-size: 13px; }
.hero-link { color: white; font-size: 12px; background: linear-gradient(120deg,#149ff6,#1765e9); }
.hero-art { width: 270px; height: 270px; top: -20px; right: 12px; background: url('/assets/aib-avatar.webp') center / contain no-repeat; border: 0; filter: drop-shadow(0 0 22px #008fff55); }
.hero-art:before, .hero-art:after, .hero-orb { display: none; }
.metric, .panel, .search-card, .listing-card { background: linear-gradient(145deg,#192433,#151e2a); border: 1px solid #2b3a4d; box-shadow: var(--shadow); }
.metric { min-height: 124px; }
.metric-top, .metric-note { color: #9aacc3; font-size: 11px; }
.metric-icon { background: #15385b; color: #45b9ff; }
.metric-icon.green { background: #193a31; color: #60d4a3; }
.metric-icon.orange { background: #482e1d; color: #ffad56; }
.metric-icon.purple { background: #312b4e; color: #be9aff; }
.metric-value { color: #fff; }
.panel-head h2, .detail-grid h2, .subsection-head h2 { font-size: 16px; }
.panel-head button, .text-link, .back-link { color: #52baff; font-size: 12px; }
.monitor-row, .offer-row { border-color: #2b394b; padding-block: 15px; }
.monitor-row:hover, .offer-row:hover { background: #1b2d41; }
.monitor-symbol, .offer-thumb { background: #163c61; color: #3ab4ff; }
.monitor-symbol svg, .offer-thumb svg { width: 22px; height: 22px; }
.monitor-info strong, .offer-info strong { font-size: 13px; }
.monitor-info small, .offer-info small, .monitor-meta small { color: #96a9c0; font-size: 11px; }
.offer-price { font-size: 13px; }
.offer-price small { color: #ffac54; font-size: 10px; }
.status { background: #153d31; color: #65dfaa; font-size: 10px; }
.status.paused { background: #293240; color: #bdc5d2; }
.status.scanning { background: #183c68; color: #80caff; }
.status.source_unavailable { background: #4b291f; color: #ffa485; }
.search-card:hover, .listing-card:hover { box-shadow: 0 16px 40px #0005; border-color: #3676ab; }
.search-card h3 { font-size: 16px; color: #fff; }
.card-desc, .card-stats span, .card-footer { color: #9dafc4; font-size: 11px; }
.card-stats, .listing-meta { border-color: #344257; }
.card-stats strong { color: #fff; }
.card-footer .open { color: #55bdff; }
.search-input, .select, .form-field input, .form-field select { background: #1c2634; border: 1px solid #354459; color: #edf5ff; font-size: 13px; color-scheme: dark; }
.search-input::placeholder, .form-field input::placeholder { color: #8193aa; }
.search-input:focus, .form-field input:focus, .form-field select:focus { border-color: #2daeff; box-shadow: 0 0 0 3px #1a96ed33; }
.listing-card { padding: 14px; }
.listing-art { height: 135px; background: radial-gradient(circle at 50% 15%,#1a6494,#112946 50%,#182330); color: #8bd0ff; border: 1px solid #2b5277; }
.listing-art svg { width: 51px; height: 51px; }
.listing-art.category-laptop { background: radial-gradient(circle at 50% 15%,#36537d,#202c45 55%,#182330); }
.listing-art.category-camera { background: radial-gradient(circle at 50% 15%,#46527a,#252941 55%,#182330); }
.listing-art.category-chair, .listing-art.category-box { background: radial-gradient(circle at 50% 15%,#4b4e71,#25283d 55%,#182330); }
.score-badge { color: #fff; background: #f17911; font-size: 10px; box-shadow: 0 4px 15px #f1791155; }
.listing-card h3 { color: #f5f8fd; font-size: 13px; }
.listing-price { color: #fff; font-size: 20px; }
.listing-meta { color: #a2b2c4; font-size: 11px; }
.empty { background: #151f2c; border-color: #3b4a5b; color: #a4b4c7; font-size: 13px; }
.empty strong { color: #f4f8ff; font-size: 16px; }
.pagination { color: #a2b2c4; font-size: 12px; }
.pagination button { background: #1b2634; color: #c1d2e8; }
.detail-meta { color: #9db0c7; font-size: 12px; flex-wrap: wrap; }
.form-field { color: #aec0d3; font-size: 12px; }
.info-line { border-color: #303f51; color: #acbdd0; font-size: 12px; }
.info-line strong { color: #eff6ff; font-size: 12px; }
.market-block { background: #142e4b; border: 1px solid #2d5381; }
.market-block small, .market-block span { color: #a2bad3; font-size: 11px; }
.market-block strong { color: #fff; }
.error-box { background: #40251e; color: #ffb39b; font-size: 12px; }
.overlay { background: #050a13c9; backdrop-filter: blur(7px); }
.modal, .drawer { background: #17202c; border: 1px solid #344459; color: #f2f7ff; }
.modal-head h2 { font-size: 21px; }
.modal-head p { color: #a5b6c9; font-size: 12px; }
.close-button { background: #273447; color: #dae6f4; }
.drawer-section { border-color: #344256; }
.drawer-section h3 { font-size: 14px; }
.drawer-section p { color: #a8bacd; font-size: 12px; }
.pill-list span { background: #263c53; color: #b1d9fb; font-size: 11px; }
.history-row { border-color: #344256; color: #a6b9ce; font-size: 12px; }
.history-row strong { color: #fff; }
.toast { background: #234868; font-size: 13px; }
.toast.error { background: #9d3e39; }
.loading { color: #a9bbd1; font-size: 13px; }
.spinner { border-color: #17436c; border-top-color: #39b5ff; }
.market-layout { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(240px,.8fr); gap: 16px; }
.market-main, .market-aside { padding: 24px; }
.market-title { display: flex; justify-content: space-between; gap: 16px; align-items: start; }
.market-title h2, .market-aside h2 { margin: 0; font-size: 18px; }
.market-title .select { max-width: 44%; }
.market-big-label { color: #a8b9cc; margin-top: 35px; font-size: 12px; }
.market-big-number { color: white; font-size: clamp(34px,4vw,53px); font-weight: 800; letter-spacing: -2px; }
.market-explain, .market-aside p { color: #a6b8cc; font-size: 12px; line-height: 1.65; }
.trend-section { margin: 28px 0 22px; padding: 20px 18px 14px; background: linear-gradient(155deg,#182b42,#142031 70%); border: 1px solid #2b496b; border-radius: 15px; overflow: hidden; }
.trend-header { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.trend-header .eyebrow { display: block; margin-bottom: 5px; }
.trend-header h3 { font-size: 15px; margin: 0; }
.trend-controls { display: flex; background: #0c1827; border: 1px solid #29415c; border-radius: 9px; padding: 3px; gap: 2px; flex: none; }
.trend-controls button { border: 0; color: #9eb2c9; background: transparent; border-radius: 6px; padding: 7px 9px; font-size: 10px; font-weight: 800; }
.trend-controls button.active { color: #fff; background: linear-gradient(120deg,#159ff1,#1465dd); box-shadow: 0 2px 10px #137ce74d; }
.trend-summary { color: #ffb568; font-size: 12px; font-weight: 800; margin-top: 11px; }
.trend-summary.down { color: #70d8b7; }
.trend-svg { width: 100%; height: auto; overflow: visible; margin: 4px 0 -8px; }
.trend-svg .trend-grid { fill: none; stroke: #38506a; stroke-width: 1; stroke-dasharray: 3 5; }
.trend-svg .trend-line { fill: none; stroke: #22aaff; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 5px #0099ff88); }
.trend-svg .trend-point { fill: #b9e9ff; stroke: #1ca4ff; stroke-width: 2; }
.trend-svg text { fill: #92a8bf; font-size: 13px; font-family: Manrope, sans-serif; }
.trend-empty { padding: 30px 15px; border: 1px dashed #3a5470; border-radius: 12px; margin-top: 17px; color: #aec2d8; font-size: 12px; line-height: 1.6; text-align: center; }
.range-chart { margin: 38px 0 25px; }
.range-track { height: 20px; position: relative; border-radius: 20px; background: linear-gradient(90deg,#1260a0,#10a8f0 50%,#ff952e); box-shadow: 0 0 20px #0b86df66; }
.range-marker { position: absolute; top: 50%; height: 35px; width: 4px; background: white; border-radius: 5px; transform: translate(-50%,-50%); box-shadow: 0 0 0 5px #ffffff40; }
.range-values { display: flex; justify-content: space-between; color: #f1f6ff; font-weight: 800; margin-top: 13px; }
.range-values small { display: block; color: #95a9c0; font-weight: 500; font-size: 11px; }
.market-note { background: #213044; border-left: 3px solid #2faaf4; padding: 13px; border-radius: 8px; color: #b1c5d9; line-height: 1.5; margin-bottom: 20px; font-size: 12px; }
.market-aside .primary-button { margin-top: 16px; }
.deals-intro { display: flex; gap: 14px; align-items: center; padding: 15px 18px; border: 1px solid #80441a; background: linear-gradient(90deg,#3b2618,#222632); border-radius: 13px; margin-bottom: 18px; }
.deals-intro > span { font-size: 22px; }
.deals-intro strong, .deals-intro small { display: block; }
.deals-intro small { color: #c1af9f; font-size: 11px; margin-top: 2px; }
.deals-grid .listing-card { border-color: #61401e; }
.auth-card { padding: 28px; max-width: 510px; }
.auth-card h2 { font-size: 18px !important; }
.auth-card p { color: #afc0d5; font-size: 13px; line-height: 1.7; }
.auth-mode .sidebar, .auth-mode .breadcrumb, .auth-mode .side-promo, .auth-mode .mobile-nav { display: none; }
.auth-mode .mobile-brand { display: flex; align-items: center; gap: 10px; }
.auth-mode .topbar { padding-inline: clamp(18px,4vw,55px); }
.auth-mode .content { max-width: 1300px; padding-block: clamp(25px,5vw,65px); }
.auth-hero { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(280px,.85fr); min-height: 570px; background: radial-gradient(circle at 80% 48%,#133d67 0,#102239 35%,transparent 65%),linear-gradient(125deg,#121d2d,#0d1521); border: 1px solid #2b4a67; border-radius: 23px; overflow: hidden; box-shadow: 0 25px 70px #0005; }
.auth-copy { align-self: center; padding: clamp(26px,5vw,68px); position: relative; z-index: 1; }
.auth-copy h1 { color: #fff; font-size: clamp(32px,4.2vw,55px); line-height: 1.12; letter-spacing: -.055em; margin: 0; }
.auth-copy h1 span { color: #36b1ff; }
.auth-copy > p { color: #b4c8dd; font-size: 15px; line-height: 1.7; max-width: 485px; margin: 20px 0 28px; }
.auth-steps { display: grid; gap: 10px; margin-bottom: 31px; }
.auth-steps > div { display: flex; align-items: center; gap: 14px; color: #d4e1f0; font-size: 13px; }
.auth-steps b { flex: none; width: 35px; height: 35px; border-radius: 10px; display: grid; place-items: center; background: #183a5e; border: 1px solid #2c608b; color: #69c5ff; font-size: 11px; }
.auth-steps strong { color: #fff; }
.auth-copy .primary-button { min-height: 48px; font-size: 13px; }
.auth-copy .error-box { max-width: 475px; }
.auth-visual { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 25px; position: relative; }
.auth-visual:before { content: ''; position: absolute; width: 310px; height: 310px; background: #078eff; filter: blur(100px); opacity: .28; border-radius: 50%; }
.auth-visual img { width: min(90%,420px); height: auto; aspect-ratio: 1; object-fit: cover; position: relative; border-radius: 50%; box-shadow: 0 25px 45px #0009, 0 0 35px #128ffa44; }
.auth-visual-caption { position: relative; color: #c8d9ea; font-size: 11px; letter-spacing: .05em; margin-top: 15px; }
.auth-visual-caption span { color: #ff9a32; }
.source-notice { display: flex; gap: 14px; align-items: start; border-radius: 13px; padding: 15px 17px; margin-bottom: 19px; font-size: 12px; }
.source-notice.error { background: #3a251d; border: 1px solid #82502d; }
.source-notice.scanning { background: #152d48; border: 1px solid #2b658e; }
.notice-icon { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; color: #ffd6a4; background: #7b4a24; font-weight: 800; }
.scanning .notice-icon { color: #b8e6ff; background: #23537b; }
.source-notice strong { color: #fff; font-size: 13px; }
.source-notice p { margin: 5px 0 0; color: #c5b7b3; line-height: 1.5; overflow-wrap: anywhere; }
.source-notice.scanning p { color: #b1c6dc; }
.source-notice small { display: block; color: #ffbf8b; margin-top: 6px; }
@media(max-width: 1150px) { .market-layout { grid-template-columns: 1fr; } }
@media(max-width: 720px) {
  body { background: #0b111b; }
  .topbar { background: #101722; height: 58px; }
  .mobile-brand .brand-mark { border-radius: 50%; }
  .mobile-brand strong { font-size: 14px; }
  .live-pill { background: #193a30; font-size: 0; }
  .content { padding-top: 25px; }
  .section-head { align-items: start; }
  .section-head h1, .page-title { font-size: 24px; }
  .section-head p { font-size: 12px; }
  .section-head .primary-button, .section-head .secondary-button { font-size: 11px; }
  .hero { min-height: 203px; }
  .hero-copy { padding: 21px; }
  .hero h2 { font-size: 20px; max-width: 260px; }
  .hero p { font-size: 11px; max-width: 205px; }
  .hero-art { width: 155px; height: 155px; top: 24px; right: -55px; opacity: .7; }
  .metric { min-height: 105px; }
  .metric-top { font-size: 10px; }
  .grid-cards, .listing-grid { grid-template-columns: 1fr; }
  .listing-card { display: grid; grid-template-columns: 94px minmax(0,1fr); grid-template-rows: auto auto auto; gap: 3px 12px; padding: 10px; }
  .listing-art { grid-row: 1 / 4; height: 92px; margin: 0; }
  .listing-art svg { width: 35px; height: 35px; }
  .score-badge { top: auto; bottom: 4px; right: 4px; font-size: 8px; padding: 3px 4px; }
  .listing-card h3 { align-self: end; margin: 0; white-space: normal; line-height: 1.35; }
  .listing-price { font-size: 18px; }
  .listing-meta { margin: 0; padding: 0; border: 0; font-size: 10px; }
  .monitor-info strong, .offer-info strong { font-size: 12px; }
  .mobile-nav { background: #101a27; border-color: #2c3c50; box-shadow: 0 -8px 35px #0006; }
  .mobile-nav button { color: #8ea4bc; font-size: 10px; }
  .mobile-nav button.active { color: #35b1ff; }
  .mobile-nav svg { width: 21px; height: 21px; }
  .market-main, .market-aside { padding: 19px; }
  .market-title { flex-direction: column; }
  .market-title .select { max-width: none; width: 100%; }
  .market-big-label { margin-top: 24px; }
  .trend-section { padding: 16px 12px 10px; }
  .trend-header { flex-direction: column; }
  .trend-controls { align-self: stretch; justify-content: space-between; }
  .trend-controls button { flex: 1; }
  .auth-mode .content { padding: 16px 14px 28px; }
  .auth-mode .live-pill { display: none; }
  .auth-hero { display: flex; flex-direction: column-reverse; min-height: 0; border-radius: 17px; }
  .auth-visual { padding: 24px 12px 0; }
  .auth-visual img { width: min(56%,190px); }
  .auth-visual-caption { display: none; }
  .auth-copy { padding: 22px; }
  .auth-copy h1 { font-size: 30px; }
  .auth-copy > p { margin: 14px 0 21px; font-size: 13px; }
  .auth-steps { margin-bottom: 22px; }
  .auth-steps > div { font-size: 12px; }
  .auth-copy .primary-button { width: 100%; }
}
@media(max-width: 390px) {
  .section-head { flex-wrap: wrap; }
  .section-head .primary-button, .section-head .secondary-button { width: 100%; }
}