:root{
  --bg:#f3f4f6;
  --surface:#ffffff;
  --surface-soft:#f8f8f8;
  --surface-muted:#eeeeee;
  --header:#1f1f1f;
  --header-2:#2b2b2b;
  --text:#252525;
  --muted:#6f6f6f;
  --border:#d9d9d9;
  --border-strong:#c7c7c7;
  --accent:#f27a00;
  --accent-dark:#d96500;
  --accent-soft:#fff1e4;
  --green:#149447;
  --red:#d64045;
  --amber:#b66b00;
  --shadow:0 1px 3px rgba(0,0,0,.08);
  --shadow-raised:0 6px 18px rgba(0,0,0,.10);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;
  font-family:Inter,Arial,Helvetica,sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
button,input,select,textarea{font:inherit}

.shell{max-width:1500px;margin:0 auto;padding:0 20px 30px}

.topbar{
  margin:0 -20px;
  padding:15px 20px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  background:var(--header);
  color:#fff;
  border-bottom:3px solid var(--accent);
  box-shadow:0 2px 7px rgba(0,0,0,.22);
}
.brand{display:flex;flex-direction:column;gap:7px;min-width:0}
.brand .chip{align-self:flex-start}
.brand h1{margin:0;font-size:clamp(23px,2.4vw,34px);line-height:1.05;letter-spacing:-.035em}
.sub{max-width:920px;color:#c9c9c9;font-size:13px;line-height:1.45}
.status-box{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;max-width:600px}
.chip{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border:1px solid #4a4a4a;
  border-radius:4px;
  background:#303030;
  color:#dedede;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
a.chip{text-decoration:none;transition:background .15s ease,border-color .15s ease}
a.chip:hover{background:var(--accent);border-color:var(--accent);color:#fff}

.market-nav{
  margin:0 -20px 18px;
  padding:0 20px;
  display:flex;
  gap:0;
  overflow-x:auto;
  background:var(--header-2);
  border-bottom:1px solid #111;
  box-shadow:var(--shadow);
}
.market-nav a{
  padding:11px 17px;
  color:#e7e7e7;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
  border-bottom:3px solid transparent;
}
.market-nav a:hover,.market-nav a.active{background:#353535;border-bottom-color:var(--accent);color:#fff}

.summary,
.panel,
.sidebar,
.promo-card,
.latest-post-card,
.dm-panel{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:8px;
  box-shadow:var(--shadow);
}

.summary{margin:18px 0;padding:20px 22px;border-top:4px solid var(--accent)}
.summary-top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
.summary-kicker,.post-kicker,.promo-kicker,.dm-label,.section-title,.sidebar-title,.asset-loader-kicker{
  color:var(--accent-dark);
  font-size:11px;
  font-weight:800;
  letter-spacing:.105em;
  text-transform:uppercase;
}
.summary-headline{font-size:clamp(22px,2.3vw,30px);line-height:1.25;margin:5px 0 0;color:#1f1f1f}
.summary-tags{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.tag{
  padding:6px 9px;
  border-radius:3px;
  background:var(--surface-soft);
  border:1px solid var(--border);
  color:#555;
  font-size:11px;
  font-weight:700;
}
.summary-bullets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-top:16px;border:1px solid var(--border)}
.summary-bullet{padding:12px 14px;background:#fff;color:#444;font-size:13px;line-height:1.5;border-bottom:1px solid var(--border)}
.summary-bullet:nth-child(odd){border-right:1px solid var(--border)}
.summary-bullet:nth-last-child(-n+2){border-bottom:0}

.quick-row{display:grid;grid-template-columns:1fr;gap:18px;margin:0 0 18px}
.promo-card,.latest-post-card{overflow:hidden;width:100%}
.promo-card a,.latest-post-card a{display:block;text-decoration:none;height:100%;color:inherit}
.promo-card{background:#191919}
.promo-visual{min-height:225px;padding:24px;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;position:relative;background:linear-gradient(120deg,#572600,#171717)}
.promo-visual.has-image{min-height:0;aspect-ratio:1200/300;background-size:contain;background-position:center;background-repeat:no-repeat;background-color:#191919;padding:0}
.promo-visual.has-image .promo-kicker,.promo-visual.has-image .promo-title,.promo-visual.has-image .promo-sub{display:none}
.promo-title,.post-title{font-size:25px;font-weight:800;line-height:1.17}
.promo-title{color:#fff}.promo-sub{color:#ddd;font-size:14px;line-height:1.5}

.latest-post-card{min-height:250px}
.latest-post-card a{display:grid;grid-template-columns:minmax(300px,.8fr) 1.35fr;align-items:stretch}
.latest-post-image{min-height:250px;background:#e6e6e6;border-right:1px solid var(--border);overflow:hidden}
.latest-post-image img{width:100%;height:100%;display:block;object-fit:cover}
.latest-post-placeholder{height:100%;display:flex;align-items:center;justify-content:center;padding:22px;color:#777;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;text-align:center;background:linear-gradient(135deg,#ececec,#d6d6d6)}
.latest-post-body{padding:27px 30px;display:flex;flex-direction:column;justify-content:center;gap:11px;border-left:4px solid var(--accent)}
.post-title{font-size:clamp(24px,2.35vw,34px);color:#222;max-width:900px}
.post-sub{color:#595959;font-size:14px;line-height:1.55;max-width:920px}
.post-meta{margin-top:7px;color:var(--muted);font-size:12px}

.dm-panel{margin:0 0 18px;padding:20px 22px}
.dm-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:15px;padding-bottom:13px;border-bottom:1px solid var(--border)}
.dm-head h2{margin:4px 0 0;font-size:21px;line-height:1.25;color:#222}
.dm-head p{margin:6px 0 0;color:var(--muted);font-size:13px;line-height:1.5;max-width:850px}
.dm-grid{display:grid;grid-template-columns:1.08fr .92fr 1.18fr;gap:13px}
.dm-card{border:1px solid var(--border);border-radius:6px;background:#fff;padding:15px;min-height:178px}
.dm-card:first-child{border-top:3px solid var(--accent)}
.dm-value{margin-top:9px;font-size:28px;font-weight:800;letter-spacing:-.03em;color:#222}
.dm-note{margin-top:8px;color:#666;font-size:12px;line-height:1.5}
.dm-mini{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}
.dm-mini div{padding:10px;border-radius:4px;background:var(--surface-soft);border:1px solid var(--border)}
.dm-mini small{display:block;color:#717171;font-size:11px;line-height:1.3}
.dm-mini strong{display:block;margin-top:5px;font-size:14px;line-height:1.2;color:#2c2c2c}
.dm-note--small{margin-top:10px;font-size:12px}
.dm-news{display:grid;gap:7px;margin-top:9px}
.dm-news a{text-decoration:none;display:block;padding:9px 10px;border-radius:4px;background:var(--surface-soft);border:1px solid var(--border)}
.dm-news a:hover{border-color:var(--accent);background:var(--accent-soft)}
.dm-news strong{display:block;font-size:13px;line-height:1.32;color:#2c2c2c}
.dm-news small{display:block;color:var(--muted);margin-top:4px;font-size:11px}

.layout{display:grid;grid-template-columns:minmax(0,1.72fr) 390px;gap:18px;align-items:start}
.panel,.sidebar{padding:18px}
.sidebar{position:sticky;top:12px;height:calc(100vh - 24px);display:flex;flex-direction:column;overflow:hidden}
.sidebar-scroll{flex:1;min-height:0;overflow-y:auto;padding-right:4px;scrollbar-width:thin;scrollbar-color:#b4b4b4 #efefef}
.sidebar-scroll::-webkit-scrollbar{width:8px}.sidebar-scroll::-webkit-scrollbar-thumb{background:#aaa;border-radius:10px}.sidebar-scroll::-webkit-scrollbar-track{background:#eee}

.hero-stats,.hero-bottom{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.stat{padding:13px 14px;border:1px solid var(--border);border-radius:5px;background:#fff;min-height:94px}
.stat small{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#777;margin-bottom:8px;font-weight:700}
.stat .value{font-size:19px;font-weight:800;line-height:1.2;color:#222}
.stat .hint{margin-top:7px;font-size:11px;color:var(--muted);line-height:1.35}

.chart-card{margin-top:12px;padding:16px;border-radius:6px;background:#fff;border:1px solid var(--border)}
.chart-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:11px;padding-bottom:11px;border-bottom:1px solid var(--border)}
.hero-title{font-size:23px;font-weight:800;margin:0 0 5px;color:#202020}
.hero-caption{font-size:12px;color:var(--muted);line-height:1.45}
.range-tabs{display:flex;gap:4px;flex-wrap:wrap}
.range-tabs button{border:1px solid var(--border);cursor:pointer;padding:7px 10px;border-radius:3px;background:#fff;color:#555;font-weight:700;font-size:12px}
.range-tabs button:hover{border-color:var(--accent);color:var(--accent-dark)}
.range-tabs button.active{background:var(--accent);border-color:var(--accent);color:#fff}
.chart-wrap{height:430px;position:relative}
.chart-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px;pointer-events:none}

.asset-loader{position:absolute;inset:0;z-index:5;display:none;align-items:center;justify-content:center;padding:24px;border-radius:5px;background:rgba(255,255,255,.86);backdrop-filter:blur(4px)}
.asset-loader.active{display:flex}
.asset-loader-box{width:min(420px,100%);padding:20px;border-radius:6px;border:1px solid var(--border);background:#fff;box-shadow:var(--shadow-raised)}
.asset-loader-title{font-size:19px;font-weight:800;margin:7px 0;color:#222}
.asset-loader-sub{color:var(--muted);font-size:13px;line-height:1.45;margin-bottom:15px}
.asset-progress{height:6px;overflow:hidden;border-radius:10px;background:#e2e2e2}
.asset-progress-bar{width:42%;height:100%;border-radius:10px;background:linear-gradient(90deg,var(--accent-dark),var(--accent),#ffb35f);animation:assetLoaderMove 1.15s ease-in-out infinite}
@keyframes assetLoaderMove{0%{transform:translateX(-120%)}50%{transform:translateX(80%)}100%{transform:translateX(260%)}}

.section{margin-top:20px}
.section-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:9px;padding:0 2px}
.section-sub{color:var(--muted);font-size:12px;margin-top:3px}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.market-card{padding:13px;border-radius:5px;background:#fff;border:1px solid var(--border);cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.market-card:hover{transform:translateY(-1px);border-color:#b8b8b8;box-shadow:var(--shadow-raised)}
.market-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.market-name{font-weight:750;line-height:1.3;color:#262626}
.market-ticker{margin-top:4px;font-size:11px;color:#808080}
.market-price{margin-top:13px;font-size:23px;font-weight:800;color:#222}
.live-price{display:inline-block;border-radius:3px;padding:1px 3px;margin-left:-3px;transition:transform .2s ease,background .4s ease,color .4s ease}
.flash-up{animation:flashUp 1.1s ease}.flash-down{animation:flashDown 1.1s ease}
@keyframes flashUp{0%{background:#dff3e7;transform:translateY(-1px)}100%{background:transparent;transform:translateY(0)}}
@keyframes flashDown{0%{background:#fde4e5;transform:translateY(1px)}100%{background:transparent;transform:translateY(0)}}
.market-move{margin-top:6px;font-size:13px;font-weight:800}
.market-foot{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:7px;padding-top:7px;border-top:1px solid #ececec}
.market-time{font-size:10px;color:var(--muted)}
.state-badge{padding:4px 6px;border-radius:3px;font-size:9px;text-transform:uppercase;letter-spacing:.06em;background:#f0f0f0;color:#666;border:1px solid #e1e1e1}
.spark{width:100%;height:42px;margin-top:8px}

.sidebar-title{margin:0 0 10px;padding-bottom:9px;border-bottom:2px solid var(--accent)}
.watchlist{border-radius:5px;overflow:hidden;border:1px solid var(--border);background:#fff}
.watch-head,.watch-row{display:grid;grid-template-columns:minmax(0,1.35fr) 92px 80px;gap:9px;padding:10px 11px}
.watch-head{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#696969;background:#f0f0f0;position:sticky;top:0;z-index:2;font-weight:800}
.watch-row{border-top:1px solid #ececec;cursor:pointer;align-items:start}
.watch-row:hover{background:#fff8f1}
.watch-row strong{display:block;line-height:1.25;color:#292929}.watch-row small{display:block;margin-top:4px;color:var(--muted);font-size:10px;line-height:1.3}
.watch-price,.watch-var{font-weight:800;text-align:right}.watch-var small,.watch-price small{text-align:right;font-weight:500}
.asset-detail{margin-bottom:14px;padding:14px;border-radius:5px;border:1px solid var(--border);background:var(--surface-soft);border-top:3px solid var(--accent)}
.asset-detail h4{margin:0 0 5px;font-size:18px;line-height:1.3;color:#222}.asset-detail .asset-symbol{font-size:11px;color:#777;margin-bottom:10px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.detail-item{padding:9px;border-radius:4px;background:#fff;border:1px solid var(--border)}.detail-item small{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}.detail-item strong{font-size:12px;line-height:1.3;color:#222}.detail-note{margin-top:10px;font-size:11px;color:var(--muted);line-height:1.4}

.news-list{display:flex;flex-direction:column;gap:8px}.news-list-wide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.news-item{padding:13px;border-radius:5px;background:#fff;border:1px solid var(--border)}
.news-item.featured{border-left:4px solid var(--accent);background:#fffaf5}
.news-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:10px;color:#777;margin-bottom:7px}
.news-badge{padding:3px 6px;border-radius:3px;background:#eeeeee;color:#555}
.news-title{font-weight:750;line-height:1.4;color:#272727}
.news-desc{margin-top:7px;font-size:12px;color:#666;line-height:1.45}
.news-title a{text-decoration:none}.news-title a:hover{color:var(--accent-dark);text-decoration:underline}

.note{margin-top:12px;font-size:11px;color:var(--muted);line-height:1.4}
.warn{margin-top:14px;padding:12px 14px;border-radius:5px;border:1px solid #e1bd8a;background:#fff5e5;color:#744400;font-size:12px;line-height:1.5}
.positive{color:var(--green)!important}.negative{color:var(--red)!important}.neutral{color:#666!important}
.mini-btn{display:inline-flex;text-decoration:none;border:1px solid var(--border);border-radius:4px;padding:8px 10px;color:#444;font-size:12px;font-weight:700;background:#fff}

@media(max-width:1180px){
  .layout{grid-template-columns:1fr}
  .summary-bullets{grid-template-columns:1fr}.summary-bullet,.summary-bullet:nth-child(odd),.summary-bullet:nth-last-child(-n+2){border-right:0;border-bottom:1px solid var(--border)}.summary-bullet:last-child{border-bottom:0}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-stats,.hero-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sidebar{order:-1;position:relative;top:auto;height:auto}
  .news-list-wide{grid-template-columns:1fr}
  .latest-post-card a{grid-template-columns:1fr}
  .latest-post-image{min-height:210px;border-right:0;border-bottom:1px solid var(--border)}
  .latest-post-body{border-left:0;border-top:4px solid var(--accent)}
  .dm-grid{grid-template-columns:1fr}
  .dm-head{flex-direction:column}
}

@media(max-width:760px){
  .shell{padding:0 11px 20px}
  .topbar,.market-nav{margin-left:-11px;margin-right:-11px;padding-left:11px;padding-right:11px}
  .topbar{align-items:flex-start;flex-direction:column}
  .status-box{justify-content:flex-start}
  .summary{padding:16px}
  .summary-top,.chart-head{flex-direction:column;align-items:flex-start}
  .summary-tags{justify-content:flex-start}
  .cards,.hero-stats,.hero-bottom{grid-template-columns:1fr}
  .watch-head,.watch-row{grid-template-columns:minmax(0,1fr) 78px 70px}
  .detail-grid{grid-template-columns:1fr}
  .chart-wrap{height:340px}
  .promo-visual.has-image{aspect-ratio:auto;min-height:150px;background-size:contain}
  .latest-post-body{padding:22px}
  .dm-panel,.panel,.sidebar{padding:14px}
}