/* NGP 开启后：TBT 导航卡（对齐原 NGP 左上角） */
.tbt-nav-card {
    position: absolute;
    left: 44px;
    /* 全屏合并卡 NGP 顶：118px（与 --ngp-widget-top-combined 一致） */
    top: 118px;
    z-index: 565;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.28s ease, visibility 0.28s ease;
}

.tbt-nav-card.is-on {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.tbt-nav-card__img {
    display: block;
    width: auto;
    height: auto;
    max-width: none;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}

/* 分屏：与单行 NGP 同 left/top（40, 46） */
.canvas.state-2 .tbt-nav-card:not(.is-on-map),
.canvas.state-c .tbt-nav-card:not(.is-on-map) {
    left: 40px;
    top: 46px;
}

/* 挂在地图面板内：对齐地图搜索框 map-top-bar（40, 46） */
.map-window > .tbt-nav-card.is-on-map,
.tbt-nav-card.is-on-map {
    left: 40px;
    top: 46px;
    z-index: 40;
}

/* 1/3 用较窄切图；2/3 / 全屏用宽图 */
.tbt-nav-card[data-pane="1-3"] .tbt-nav-card__img {
    width: 414px;
    height: auto;
}

.tbt-nav-card[data-pane="2-3"] .tbt-nav-card__img {
    width: 480px;
    height: auto;
}

/*
 * debug 切换钮：整屏右下角、Dock 上方
 * 仅壁纸桌面 + NGP 开启时显示（.is-visible）
 * 默认 is-on = TBT 在地图；点击切到壁纸桌面
 * SR 桌面：不显示，TBT 永远在场景
 */
#canvas > .tbt-map-toggle {
    position: absolute;
    right: calc(46px + 21.33px);
    bottom: 96px; /* dock 80 + 16 间距 */
    z-index: 12100;
    display: none;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 12px;
    appearance: none;
    -webkit-appearance: none;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
}

#canvas > .tbt-map-toggle.is-visible {
    display: inline-flex;
}

#canvas > .tbt-map-toggle .tbt-map-toggle__icon {
    display: block;
    width: 30px;
    height: 30px;
    pointer-events: none;
}

#canvas > .tbt-map-toggle:hover {
    background: rgba(255, 255, 255, 0.3);
}

#canvas > .tbt-map-toggle:active {
    transform: scale(0.94);
}

#canvas > .tbt-map-toggle.is-on {
    background: rgba(255, 255, 255, 0.38);
}

#canvas > .tbt-map-toggle:focus,
#canvas > .tbt-map-toggle:focus-visible {
    outline: none;
}
