.game-detail-page { padding: 8px 0 40px; color: #171b2c; }
.detail-breadcrumb { display: flex; overflow: hidden; align-items: center; gap: 10px; margin: 4px 0 20px; color: #969caf; font-size: .78rem; white-space: nowrap; }
.detail-breadcrumb a { color: #6672cb; font-weight: 700; }
.detail-breadcrumb span:last-child { overflow: hidden; text-overflow: ellipsis; }
.game-hero { display: grid; grid-template-columns: 260px minmax(0, 1fr) 250px; gap: clamp(28px, 4vw, 58px); align-items: center; padding: clamp(28px, 4vw, 54px); border-radius: 28px; background: radial-gradient(circle at 90% 0, rgba(113,88,244,.28), transparent 32%), linear-gradient(145deg, #090d20, #171b3d 65%, #24144b); box-shadow: 0 24px 60px rgba(13,18,43,.22); color: #fff; }
.detail-cover { position: relative; overflow: hidden; aspect-ratio: 4/5; border-radius: 20px; background: #252b48; box-shadow: 0 22px 45px rgba(0,0,0,.35); }
.detail-cover img { width: 100%; height: 100%; object-fit: cover; }
.detail-cover-placeholder { display: grid; width: 100%; height: 100%; place-items: center; background: linear-gradient(145deg,#304fb3,#6d45d4); font-size: 2rem; font-weight: 900; }
.detail-type { position: absolute; top: 13px; left: 13px; padding: 6px 9px; border-radius: 8px; background: rgba(7,10,23,.75); backdrop-filter: blur(10px); color: rgba(255,255,255,.82); font-size: .6rem; font-weight: 800; letter-spacing: .09em; }
.detail-kicker,.panel-heading > div > span { color: #8ea5ff; font-size: .65rem; font-weight: 800; letter-spacing: .16em; }
.game-hero-copy h1 { max-width: 680px; margin: 10px 0 9px; font-size: clamp(2rem,3.7vw,4rem); font-weight: 800; letter-spacing: -.055em; line-height: 1.02; }
.detail-updated { margin: 0; color: rgba(255,255,255,.5); font-size: .78rem; }.detail-updated strong { color: rgba(255,255,255,.7); font-weight: 600; }
.current-price-block { display: flex; margin-top: 30px; flex-direction: column; }.current-price-block > span { color: rgba(255,255,255,.5); font-size: .76rem; }.current-price-block strong { margin: 2px 0; font-size: 2rem; letter-spacing: -.04em; }.current-price-block small { width: fit-content; padding: 4px 8px; border-radius: 6px; background: rgba(55,211,151,.14); color: #65dfb2; font-weight: 700; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }.detail-primary-action,.detail-watch-button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 9px; padding: 0 18px; border: 0; border-radius: 12px; cursor: pointer; font-size: .83rem; font-weight: 800; }.detail-primary-action { background: #fff; color: #171b2c; box-shadow: 0 10px 26px rgba(0,0,0,.18); }.detail-primary-action:hover { color: #171b2c; text-decoration: none; transform: translateY(-1px); }.detail-watch-button { border: 1px solid rgba(255,255,255,.17); background: rgba(255,255,255,.07); color: #fff; }.detail-watch-button.is-watched { border-color: rgba(55,211,151,.35); background: rgba(55,211,151,.13); color: #69e1b5; }
.price-facts { display: grid; gap: 10px; }.price-fact { display: flex; padding: 16px 18px; flex-direction: column; border: 1px solid rgba(255,255,255,.09); border-radius: 15px; background: rgba(255,255,255,.055); }.price-fact span { color: rgba(255,255,255,.5); font-size: .7rem; }.price-fact strong { margin-top: 3px; font-size: 1.05rem; }.price-fact.featured { border-color: rgba(103,224,178,.22); background: rgba(55,211,151,.08); }.price-fact.featured strong { color: #68dfb4; }
.detail-content-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(300px,.75fr); gap: 20px; margin-top: 22px; }.detail-panel { overflow: hidden; padding: 26px; border: 1px solid #e7e9f1; border-radius: 22px; background: #fff; box-shadow: 0 14px 38px rgba(24,31,61,.07); }.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }.panel-heading h2 { margin: 3px 0 0; font-size: 1.35rem; font-weight: 800; letter-spacing: -.035em; }.panel-heading > strong { color: #9298aa; font-size: .72rem; }.chart-legend { color: #83899c; font-size: .72rem; }.chart-legend i { display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 50%; background: #6f68f6; }.detail-chart-wrap { height: 340px; }
.price-history-table-wrap { max-height: 340px; overflow-y: auto; }.price-history-table { width: 100%; border-collapse: collapse; }.price-history-table th { position: sticky; top: 0; padding: 10px 8px; background: #fff; color: #9ca2b3; font-size: .66rem; letter-spacing: .08em; text-align: left; text-transform: uppercase; }.price-history-table th:last-child,.price-history-table td:last-child { text-align: right; }.price-history-table td { padding: 13px 8px; border-top: 1px solid #eef0f5; color: #3b4155; font-size: .8rem; }.price-history-table td:last-child { color: #202538; font-weight: 800; }.price-history-table small { margin-left: 5px; padding: 3px 5px; border-radius: 5px; background: #ecebff; color: #6862d8; font-size: .55rem; font-weight: 800; text-transform: uppercase; }
.detail-admin-bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 20px; padding: 18px 22px; border: 1px dashed #d5d9e7; border-radius: 16px; background: #f8f9fc; }.detail-admin-bar div { display: flex; flex-direction: column; }.detail-admin-bar strong { font-size: .82rem; }.detail-admin-bar span { color: #8c92a5; font-size: .72rem; }.detail-admin-bar button { padding: 10px 15px; border: 0; border-radius: 10px; background: #282d43; color: #fff; cursor: pointer; font-size: .75rem; font-weight: 800; }
@media(max-width:991.98px){.game-hero{grid-template-columns:200px minmax(0,1fr)}.price-facts{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.detail-content-grid{grid-template-columns:1fr}}
@media(max-width:575.98px){.game-hero{grid-template-columns:1fr;padding:24px}.detail-cover{width:min(100%,260px);margin:auto}.price-facts{grid-template-columns:1fr}.detail-content-grid{margin-top:14px}.detail-panel{padding:20px 16px}.detail-chart-wrap{height:280px}.detail-admin-bar{align-items:stretch;flex-direction:column}.detail-admin-bar button{width:100%}}
