.reference-lcd[hidden], .hero-wide-cockpit[hidden], #reference-lcd-editor[hidden] { display: none !important; }
.reference-lcd {
    --reference-cyan: #00f2ff;
    --reference-green: #00ff88;
    position: relative;
    width: 100%;
    max-width: 680px;
    aspect-ratio: 835 / 720;
    margin: 0 auto;
    isolation: isolate;
    z-index: 3;
}
.reference-lcd-art { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.reference-lcd-slot { position: absolute; overflow: hidden; }
.reference-lcd-slot img { display: block; width: 100%; height: 100%; transform-origin: 0 0; background: #020a14; }
.reference-lcd-slot img[hidden] { display: none !important; }
.reference-lcd-slot[hidden], .reference-card-preview [hidden] { display:none !important; }
.reference-lcd-slot.is-active { filter: drop-shadow(0 0 5px var(--reference-cyan)); }
.reference-lcd-manager .reference-lcd { max-width: 760px; margin: 12px auto 24px; }
#homepage-reference-lcd { width:min(100%,680px); max-width:680px; margin:0 auto; }
@media(max-width:991px) {
    #homepage-reference-lcd { max-width:540px; margin:28px auto 0; }
}
.reference-layout-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 14px 0; }
.reference-layout-choice { padding: 16px; border: 1px solid #ffffff25; border-radius: 10px; background: #0d1524; cursor: pointer; text-transform: none; letter-spacing: normal; }
.reference-layout-choice:has(input:checked) { border-color: #00ff88; background: #00ff880c; }
.reference-layout-choice input { width: auto; margin: 0 7px 0 0; accent-color: #00ff88; }
.reference-layout-choice strong { color: #fff; }
.reference-layout-choice small { display: block; margin-top: 7px; color: #94a3b8; }
.reference-upload-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.reference-upload-card { min-width: 0; padding: 16px; border: 1px solid #ffffff18; border-radius: 10px; background: #0d1524; }
.reference-upload-card h4 { font-size: 14px; color: #fff; margin: 0 0 8px; }
.reference-card-preview { position:relative; width:min(100%,var(--reference-preview-width,380px)); margin:12px 0; }
.reference-thumb-media { position:relative; width:100%; overflow:hidden; box-shadow:0 0 0 1px #ffffff14; }
.reference-thumb-default { position:absolute; inset:0; overflow:hidden; }
.reference-thumb-default img { position:absolute; left:0; top:0; width:1774px !important; height:887px !important; max-width:none !important; max-height:none !important; transform-origin:0 0; display:block; }
.reference-thumb-image { position:absolute; inset:0; width:100%; height:100%; max-width:none; max-height:none; object-fit:contain; display:block; }
.reference-thumb-empty { position:absolute; inset:0; display:grid; place-items:center; color:#64748b; font-size:13px; background:#050c16; }
.reference-thumb-label { display:block; margin-top:7px; color:#94a3b8; font-size:11px; }
.reference-visibility-control { display:flex; align-items:center; gap:8px; text-transform:none; letter-spacing:normal; margin:12px 0; color:#cbd5e1; }
.reference-visibility-control input { width:auto; margin:0; accent-color:#00ff88; }
.reference-image-details { margin-top:16px; }
.reference-image-details summary { color:#e5e7eb; cursor:pointer; font-weight:600; padding:12px 0; }
.reference-image-details summary:focus-visible { outline:2px solid #00ff88; outline-offset:3px; }
.reference-upload-card small { display: block; color: #94a3b8; margin-bottom: 12px; line-height: 1.6; }
.reference-upload-size { display: block; color: #00ff88; font-size: 18px; margin: 7px 0; letter-spacing: .4px; }
.reference-file-status { min-height: 20px; color: #94a3b8; font-size: 12px; margin-bottom: 12px; }
.reference-file-status.is-error { color: #ff9bae; }
.reference-upload-card .btn-row { flex-wrap: wrap; }
.reference-upload-card input[type=file] { padding: 8px; font-size: 12px; }
.reference-status { min-height: 24px; margin-top: 12px; color: #00ff88; font-size: 13px; }
.reference-status.is-error { color: #ff9bae; }
.reference-lcd-manager [disabled] { opacity:.6; cursor:wait; }
@media(max-width: 600px) {
    .reference-layout-choices, .reference-upload-grid { grid-template-columns: 1fr; }
}
