.detail-container {color:#e5e7eb;}
.detail-container .breadcrumb-box {list-style:none;display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:20px;font-size:14px;color:#9ca3af;}
.detail-container .breadcrumb-box li:not(:last-child)::after {content:"/";margin-left:8px;color:#4b5563;}
.detail-container .breadcrumb-box a {color:#60a5fa;text-decoration:none;transition:color .2s;}
.detail-container .breadcrumb-box a:hover {color:#93c5fd;text-decoration:underline;}
.detail-container .game-info-header {display:flex;gap:24px;margin-bottom:5px;flex-direction:column;}
.detail-container .game-basic-info {flex-grow:1;}
.detail-container .game-title-detail {font-size:28px;font-weight:700;margin:0 0 12px 0;color:#f9fafb;line-height:1.2;}
.detail-container .game-meta-detail {display:flex;align-items:center;gap:30px;margin-bottom:20px;}
.detail-container .game-rating-detail,.detail-container .game-views-detail {display:flex;align-items:center;gap:6px;font-size:16px;color:#d1d5db;}
.detail-container .game-player-container {position:relative;width:100%;height:500px;margin-bottom:30px;border-radius:12px;overflow:hidden;background:#1f2937 center/cover;}
.detail-container .game-player-placeholder {position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(0,0,0,.7);color:#f3f4f6;transition:opacity .3s;}
.detail-container .game-player-placeholder h3 {font-size:28px;margin-bottom:20px;text-shadow:0 2px 4px rgba(0,0,0,.8);}
.detail-container .play-button {display:inline-flex;align-items:center;gap:8px;padding:15px 35px;background:linear-gradient(to right,#3b82f6,#2563eb);color:#fff;border:none;border-radius:50px;font-size:20px;font-weight:600;cursor:pointer;transition:.3s;box-shadow:0 4px 10px rgba(0,0,0,.4);animation:pulse 2s infinite;}
.detail-container .play-button:hover {transform:translateY(-2px);opacity:.9;}
.detail-container .play-button:active {transform:translateY(0);}
.detail-container .fullscreen-toggle {position:absolute;top:16px;right:16px;z-index:1000;background:rgba(255,255,255,.1);border:none;border-radius:8px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s;}
.detail-container .fullscreen-toggle:hover {background:rgba(255,255,255,.2);}
.detail-container .fullscreen-toggle svg {color:#fff;width:20px;height:20px;}
.detail-container .game-iframe {position:absolute;inset:0;width:100%;height:100%;border:none;z-index:995;}
.detail-container .game-description-detail {background:#1f2937;border-radius:12px;padding:24px;box-shadow:0 4px 6px rgba(0,0,0,.6);margin-bottom:25px;}
.detail-container .game-description-detail h3 {font-size:20px;margin:0 0 16px 0;color:#f9fafb;font-weight:600;}
.detail-container .game-description-text {line-height:1.6;color:#d1d5db;}
.about-game-title {margin-bottom:15px;}
@keyframes pulse {0%{transform:scale(1);}50%{transform:scale(1.05);}100%{transform:scale(1);}}
@media (min-width:769px){.detail-container .game-info-header{flex-direction:row;}}
@media (max-width:768px){.detail-container .game-player-container{height:460px;border-radius:0;}}

#backButton {display:none;cursor:pointer;}
.info-fullscreen-box {display:flex;justify-content:space-between;align-items:center;height:45px;padding:0 10px;background:#1f2937;border-bottom:1px solid #374151;margin-bottom:30px;border-radius:0 0 12px 12px;color:#e5e7eb;}
.info-fullscreen-box>div:first-child {display:flex;align-items:center;gap:8px;}
.info-fullscreen-box img {height:28px;width:28px;object-fit:cover;border-radius:4px;}
.info-fullscreen-box span {font-size:14px;color:#d1d5db;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.info-fullscreen-box #fullscreen-btn {display:flex;align-items:center;cursor:pointer;}
.info-fullscreen-box #fullscreen-btn svg {fill:#9ca3af;transition:fill .2s;}
.info-fullscreen-box #fullscreen-btn:hover svg {fill:#fff;}
.detail-container .game-player-container {border-radius:12px 12px 0 0;margin-bottom:0;}
@media (max-width:768px) {.detail-container .game-player-container {border-radius:0;}
.info-fullscreen-box span {display:inline-block;max-width:200px;}
;}



:root {--primary-color:#6366f1;--primary-hover:#8b5cf6;--text-color:#e5e7eb;--light-gray:#374151;--medium-gray:#4b5563;--dark-gray:#9ca3af;--success-color:#67c23a;--error-color:#f56c6c;--shadow:0 10px 30px rgba(0,0,0,0.6);--border-radius:12px;}
.comment-container {margin:0 auto 25px;}
.comment-card {background:#1f2937;border-radius:var(--border-radius);box-shadow:var(--shadow);padding:24px;position:relative;overflow:hidden;color:var(--text-color);}
.comment-form {position:relative;z-index:2;}
.comment-title {margin-bottom:15px;color:#fff;font-weight:600;}
.comment-form-group {margin-bottom:24px;position:relative;}
.comment-label {display:flex;align-items:center;margin-bottom:8px;font-weight:600;color:#d1d5db;}
.comment-label-icon {width:20px;height:20px;margin-right:8px;fill:var(--primary-color);}
.comment-input,.comment-textarea {width:100%;padding:16px;border:2px solid var(--medium-gray);border-radius:var(--border-radius);font-size:16px;transition:all .3s ease;background:var(--light-gray);color:var(--text-color);}
.comment-input:focus,.comment-textarea:focus {outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(99,102,241,.3);background:#111827;}
.comment-textarea {min-height:120px;resize:vertical;}
.comment-button {max-width:800px;margin:0 auto;background:linear-gradient(to right,var(--primary-color),var(--primary-hover));color:#fff;border:none;padding:12px 28px;border-radius:var(--border-radius);cursor:pointer;font-size:18px;font-weight:600;transition:all .3s ease;display:flex;align-items:center;justify-content:center;width:100%;box-shadow:0 4px 10px rgba(0,0,0,.5);}
.comment-button:hover {transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.7);}
.comment-button:active {transform:translateY(0);}
.comment-submit-icon {width:20px;height:20px;margin-right:10px;fill:#fff;}
.comment-message {position:fixed;top:85px;left:50%;transform:translateX(-50%);background:#1f2937;padding:16px 24px;border-radius:6px;box-shadow:0 2px 12px rgba(0,0,0,.6);display:flex;align-items:center;z-index:10000;opacity:0;transition:opacity .3s,transform .4s;pointer-events:none;color:var(--text-color);}
.comment-message.success {border-left:4px solid var(--success-color);opacity:1;transform:translateX(-50%) translateY(10px);}
.comment-message-icon {width:20px;height:20px;margin-right:12px;fill:var(--success-color);}
.comment-message-content {font-size:16px;color:#d1d5db;}
.comment-decorative-circle {position:absolute;border-radius:50%;background:rgba(99,102,241,.1);z-index:1;}
.comment-circle-1 {width:120px;height:120px;top:-40px;right:-40px;}
.comment-circle-2 {width:80px;height:80px;bottom:-20px;left:-20px;}
@media (max-width:1200px) {.comment-container {max-width:960px;}
;}
@media (max-width:992px) {.comment-container {max-width:720px;}
;}
@media (max-width:768px) {.comment-card {padding:30px 20px;}
.comment-title {font-size:1.8rem;}
.comment-input,.comment-textarea,.comment-button {padding:14px;}
.comment-message {width:90%;top:15px;}
;}