/* ===================== 神迹 Wiki — 移动端适配（保留桌面 UI） ===================== */

/* ---- 平板及以下：通用 ---- */
@media (max-width: 900px) {
    .site-version-badge {
        left: max(10px, env(safe-area-inset-left));
        top: max(10px, env(safe-area-inset-top));
        max-width: min(46vw, 200px);
        font-size: 10px;
        padding: 5px 10px;
    }

    .modal-box {
        padding: 22px 18px;
        margin: 12px;
        max-height: calc(100dvh - 24px);
        overflow-y: auto;
    }

    .modal-box-wide {
        width: min(560px, calc(100vw - 24px));
    }

    .modal-actions {
        flex-wrap: wrap;
        gap: 10px;
    }

    .modal-actions .action-btn {
        flex: 1 1 auto;
        min-width: 120px;
    }

    .toast {
        bottom: max(24px, env(safe-area-inset-bottom));
        max-width: calc(100vw - 32px);
        text-align: center;
    }

    .chronicle-timeline-current {
        max-width: 50%;
        font-size: 11px;
    }

    .chronicle-scroll,
    .rules-scroll,
    .stories-scroll,
    .lore-scroll,
    .dice-scroll,
    .ignite-scroll,
    .forging-scroll,
    .summon-scroll,
    .charsheet-scroll,
    .industry-scroll {
        padding-top: max(64px, calc(env(safe-area-inset-top) + 52px));
        padding-left: max(14px, env(safe-area-inset-left));
        padding-right: max(14px, env(safe-area-inset-right));
    }
}

/* ---- 手机：首页 / 工具箱 hub 可滚动布局 ---- */
@media (max-width: 768px) {
    .index-page {
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    #home-view.active,
    #tools-view.active,
    .minigames-view.active,
    .minigame-detail-view.active {
        min-height: 100dvh;
        height: auto;
    }

  .index-page .home-content,
  #tools-view .home-content {
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        width: 100%;
        max-width: none;
        max-height: none;
        margin: 0;
        padding:
            max(72px, calc(env(safe-area-inset-top) + 56px))
            max(16px, env(safe-area-inset-right))
            max(28px, env(safe-area-inset-bottom))
            max(16px, env(safe-area-inset-left));
        justify-content: flex-start;
        box-sizing: border-box;
    }

    body:has(#auth-user:not(.hidden)) .index-page .home-content,
    body:has(#content-edit-toggle-wrap:not(.hidden)) .index-page .home-content,
    body:has(#auth-user:not(.hidden)) #tools-view .home-content,
    body:has(#content-edit-toggle-wrap:not(.hidden)) #tools-view .home-content {
        top: auto;
        max-height: none;
        padding-top: max(88px, calc(env(safe-area-inset-top) + 68px));
    }

    .home-center {
        max-height: none;
        overflow: visible;
    }

    .index-page .title,
    .result-page .title {
        font-size: clamp(28px, 8vw, 40px);
        margin-bottom: 20px;
        letter-spacing: 1px;
    }

    .tools-hub-sub {
        font-size: 13px;
        letter-spacing: 1px;
        margin: -8px 0 4px;
    }

    .library-portals {
        max-width: none;
        margin-top: 20px;
        gap: 10px;
    }

    .library-portal {
        gap: 12px;
        padding: 14px 14px;
        border-radius: 14px;
        min-height: 56px;
    }

    .library-portal-icon {
        width: 40px;
        height: 40px;
        font-size: 18px;
        flex-shrink: 0;
    }

    .library-portal-title {
        font-size: 16px;
        line-height: 1.3;
    }

    .library-portal-sub {
        font-size: 12px;
        line-height: 1.45;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .library-portal-arrow {
        font-size: 16px;
        flex-shrink: 0;
    }

    .search-wrap {
        width: 100%;
        margin-bottom: 16px;
    }

    .index-page .search-box {
        height: 48px;
        gap: 8px;
    }

    .index-page .search-input {
        font-size: 16px; /* 防止 iOS 聚焦放大 */
        padding-left: 40px;
    }

    .search-btn {
        min-width: 72px;
        padding: 0 14px;
        font-size: 15px;
        flex-shrink: 0;
    }

    .home-content.is-searching {
        justify-content: flex-start;
        padding-top: max(64px, calc(env(safe-area-inset-top) + 48px));
        max-height: none;
        width: 100%;
    }

    .home-scroll {
        max-height: none;
        margin-top: 8px;
        padding: 12px 4px 20px;
        -webkit-mask-image: none;
        mask-image: none;
    }

    .action-bar {
        gap: 8px;
        margin-top: 12px;
    }

    .action-btn {
        min-height: 44px;
        padding: 10px 16px;
    }

    .tools-hub-back {
        width: 100%;
        max-width: 320px;
        margin-top: 16px;
    }

    /* 词条详情页 */
    .result-page .scroll-container {
        padding:
            max(64px, calc(env(safe-area-inset-top) + 48px))
            max(12px, env(safe-area-inset-right))
            max(80px, calc(env(safe-area-inset-bottom) + 64px))
            max(12px, env(safe-area-inset-left));
    }

    .result-page .content {
        padding: 0 4px;
    }

    .result-page .result-content {
        font-size: 16px;
        line-height: 1.75;
        padding: 16px 14px;
    }

    .entry-image {
        max-height: 280px;
    }

    .image-preview-grid {
        grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    }

    .form-textarea {
        min-height: 200px;
    }

    /* 登录栏 */
    .auth-bar {
        top: max(8px, env(safe-area-inset-top));
        right: max(8px, env(safe-area-inset-right));
        left: auto;
        max-width: calc(100vw - 16px);
    }

    .content-edit-toggle-wrap {
        padding: 5px 8px;
    }

    .content-edit-toggle-label {
        font-size: 11px;
    }

    /* 工具视图滚动区 */
    .origin-scroll,
    .minigames-scroll {
        padding:
            max(64px, calc(env(safe-area-inset-top) + 52px))
            max(14px, env(safe-area-inset-right))
            max(32px, env(safe-area-inset-bottom))
            max(14px, env(safe-area-inset-left));
    }

    .origin-header,
    .minigames-header {
        gap: 10px;
        margin-bottom: 16px;
    }

    .origin-header .back-home-btn,
    .minigames-header .back-home-btn {
        width: 100%;
        max-width: 280px;
    }

    .minigame-version-grid {
        grid-template-columns: 1fr;
    }

    .minigame-version-card {
        padding: 16px 18px;
    }

    .minigame-play-header {
        padding:
            max(8px, env(safe-area-inset-top))
            max(12px, env(safe-area-inset-right))
            8px
            max(12px, env(safe-area-inset-left));
    }

    .minigame-play-header .action-btn {
        min-height: 40px;
        padding: 8px 12px;
        font-size: 13px;
    }

    .minigame-play-title {
        font-size: 15px;
        line-height: 1.35;
        flex: 1;
        min-width: 0;
    }
}

/* ---- 小屏手机 ---- */
@media (max-width: 480px) {
    .auth-bar {
        left: max(8px, env(safe-area-inset-left));
        right: max(8px, env(safe-area-inset-right));
        width: auto;
    }

    .auth-guest,
    .auth-user {
        width: 100%;
        max-width: none;
        justify-content: space-between;
        border-radius: 14px;
        padding: 6px 8px;
    }

    .auth-username {
        max-width: 96px;
        font-size: 12px;
    }

    .content-edit-toggle-label {
        display: none;
    }

    .content-edit-toggle-wrap {
        padding: 8px 10px;
    }

    .site-version-badge {
        max-width: 42vw;
    }

    .library-portal-label {
        min-width: 0;
    }

    .library-portal-sub {
        -webkit-line-clamp: 1;
    }

    .index-page .search-box {
        flex-wrap: nowrap;
    }

    .search-btn {
        min-width: 64px;
        font-size: 14px;
    }

    .action-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .action-bar .action-btn {
        width: 100%;
        max-width: none;
    }

    .modal-box-form,
    .modal-box-wide {
        width: calc(100vw - 20px);
        padding: 18px 14px;
    }

    .add-user-fields {
        grid-template-columns: 1fr;
    }

    .chronicle-sidebar,
    .rules-sidebar,
    .stories-sidebar,
    .lore-sidebar {
        max-height: 38vh;
    }

    .chronicle-intro-title,
    .chronicle-event-title,
    .rules-intro-title,
    .rules-section-title,
    .stories-intro-title,
    .stories-story-title,
    .lore-intro-title,
    .lore-section-title {
        font-size: 24px;
    }
}

/* ---- 触控优化（不影响桌面 hover） ---- */
@media (hover: none) and (pointer: coarse) {
    .library-portal:hover {
        transform: none;
    }

    .library-portal:active {
        transform: scale(0.98);
    }

    .action-btn,
    .library-portal,
    .search-btn,
    .auth-btn {
        -webkit-tap-highlight-color: transparent;
    }
}

/* ===================== 神迹工具箱 — 移动端深度适配 ===================== */

/* 工具页：允许整页滚动，避免内容被裁切 */
@media (max-width: 900px) {
    .forging-view.active,
    .ignite-view.active,
    .battlemap-view.active,
    .charsheet-view.active,
    .industry-view.active {
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .forging-scroll,
    .ignite-scroll,
    .summon-scroll,
    .dice-scroll,
    .charsheet-scroll,
    .industry-scroll {
        height: auto;
        min-height: 100%;
        padding-bottom: max(32px, env(safe-area-inset-bottom));
    }

    .forging-shell,
    .ignite-shell,
    .summon-shell,
    .dice-shell,
    .charsheet-shell,
    .industry-shell {
        max-width: 100%;
    }

    /* 工具页顶栏：标题 + 返回 */
    .forging-header,
    .ignite-header,
    .summon-header,
    .dice-header,
    .charsheet-header,
    .industry-header {
        gap: 10px;
        margin-bottom: 16px;
    }

    .forging-header .back-home-btn,
    .ignite-header .back-home-btn,
    .summon-header .back-home-btn,
    .dice-header .back-home-btn,
    .charsheet-header .back-home-btn,
    .industry-header .back-home-btn,
    .origin-header .back-home-btn {
        width: 100%;
        max-width: none;
    }

    .charsheet-actions,
    .industry-header .charsheet-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .charsheet-actions .action-btn,
    .industry-header .charsheet-actions .action-btn {
        flex: 1 1 calc(50% - 4px);
        min-width: 0;
        min-height: 44px;
    }

    .origin-shell {
        max-width: 100%;
    }

    .origin-panel,
    .ignite-panel {
        padding: 16px 14px;
    }
}

/* ---- 战斗地图 ---- */
@media (max-width: 900px) {
    .battlemap-topbar {
        grid-template-columns: 1fr;
        gap: 10px;
        padding:
            max(10px, env(safe-area-inset-top))
            max(12px, env(safe-area-inset-right))
            10px
            max(12px, env(safe-area-inset-left));
    }

    .battlemap-topbar::after {
        left: 12px;
        right: 12px;
    }

    .battlemap-topbar-brand {
        padding-left: 12px;
    }

    .battlemap-title {
        font-size: 18px;
        letter-spacing: 2px;
    }

    .battlemap-kicker {
        letter-spacing: 3px;
    }

    .battlemap-topbar-center {
        width: 100%;
        justify-self: stretch;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .battlemap-combat-start-btn,
    .battlemap-back-btn {
        width: 100%;
        max-width: none;
        justify-self: stretch;
    }

    .battlemap-combat-bar {
        width: 100%;
    }

    .battlemap-combat-bar-panel {
        flex-wrap: wrap;
        gap: 8px;
    }

    .battlemap-combat-action-group {
        flex-wrap: wrap;
        width: 100%;
    }

    .battlemap-combat-end-turn-btn,
    .battlemap-combat-stop-btn {
        flex: 1 1 auto;
        min-height: 44px;
    }

    .battlemap-shell {
        display: flex;
        flex-direction: column;
        overflow: visible;
        min-height: auto;
        flex: none;
    }

    .battlemap-canvas {
        order: 1;
        height: min(52vh, 420px);
        min-height: 280px;
        max-height: 55vh;
        flex-shrink: 0;
    }

    .battlemap-sidebar-left {
        order: 2;
    }

    .battlemap-sidebar-right {
        order: 3;
    }

    .battlemap-sidebar-left,
    .battlemap-sidebar-right {
        max-height: none;
        width: 100%;
        flex-shrink: 0;
    }

    .battlemap-sidebar-inner {
        max-height: min(48vh, 380px);
    }

    /* 手机上收起侧栏仍保留入口，避免面板消失 */
    .battlemap-shell.battlemap-shell--left-collapsed .battlemap-sidebar-left,
    .battlemap-shell.battlemap-shell--right-collapsed .battlemap-sidebar-right {
        display: flex !important;
    }

    .battlemap-float-toggle {
        min-height: 40px;
        padding: 8px 12px;
        font-size: 12px;
    }

    .battlemap-bg-toolbar {
        left: 8px;
        right: 8px;
        max-width: none;
        transform: none;
        flex-direction: column;
        align-items: stretch;
    }

    .battlemap-bg-toolbar-controls {
        flex-wrap: wrap;
        gap: 8px;
    }

    .battlemap-minimap {
        width: 140px;
        right: 8px;
        bottom: 8px;
    }

    .battlemap-modal-grid {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }

    #battlemap-piece-modal .modal-box.battlemap-piece-modal {
        width: calc(100vw - 20px) !important;
        max-width: none !important;
        max-height: calc(100dvh - 24px);
        padding: 18px 14px;
    }

    .battlemap-piece-modal-form {
        max-height: calc(100dvh - 180px);
    }

    .battlemap-btn-grid-2 {
        grid-template-columns: 1fr;
    }

    .battlemap-combat-hud {
        max-width: calc(100vw - 24px);
    }
}

@media (max-width: 480px) {
    .battlemap-canvas {
        height: min(46vh, 360px);
        min-height: 240px;
    }

    .battlemap-sidebar-inner {
        max-height: min(42vh, 320px);
    }

    .battlemap-combat-overlay-text {
        font-size: clamp(18px, 6vw, 28px);
    }
}

/* ---- 物品锻造 ---- */
@media (max-width: 900px) {
    .forging-panel-catalog {
        min-height: auto !important;
    }

    .forging-catalog-layout {
        min-height: auto;
        gap: 12px;
    }

    .forging-catalog-list {
        max-height: min(45vh, 360px);
    }

    .forging-panel {
        padding: 14px 12px;
    }

    .forging-panel-head {
        gap: 10px;
    }

    .forging-panel-head-text {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .forging-toolbar {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .forging-toolbar .wiki-custom-select,
    .forging-search,
    .forging-filter {
        width: 100%;
        min-width: 0 !important;
        flex: 1 1 auto;
    }

    .forging-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .forging-header-chips {
        flex-wrap: wrap;
        width: 100%;
    }

    .forging-forge-row {
        flex-direction: column;
        align-items: stretch;
    }

    .forging-forge-row .forging-field-group,
    .forging-btn-forge {
        width: 100%;
        min-width: 0;
    }

    .forging-qty-table,
    .forging-cost-list {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .forging-detail-content {
        max-height: none;
        font-size: 13px;
    }

    .forging-title {
        font-size: 1.45rem;
    }
}

@media (max-width: 480px) {
    .forging-stats {
        grid-template-columns: 1fr;
    }

    .forging-catalog-item-title {
        font-size: 14px;
    }
}

/* ---- 怒焰技法 / 骰子 / 召唤 ---- */
@media (max-width: 900px) {
    .ignite-tech-list.is-open {
        grid-template-columns: 1fr;
    }

    .ignite-turn-row {
        grid-template-columns: 1fr auto auto;
        gap: 8px;
    }

    .ignite-turn-label {
        grid-column: 1 / -1;
    }

    .ignite-btn-add-turn,
    .ignite-btn-calc {
        min-height: 44px;
    }

    .dice-controls {
        grid-template-columns: 1fr;
    }

    .dice-presets {
        flex-wrap: wrap;
        justify-content: center;
    }

    .dice-preset {
        min-height: 40px;
        min-width: 48px;
    }

    .summon-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .summon-actions .summon-btn,
    .summon-btn {
        width: 100%;
        min-height: 44px;
    }

    .summon-pool-item {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .summon-pool-item-actions {
        justify-content: flex-end;
    }

    .summon-field-row {
        grid-template-columns: 1fr;
    }

    .summon-god-actions {
        flex-direction: column;
    }

    .summon-god-actions .summon-btn {
        width: 100%;
    }

    .summon-history-item {
        flex-wrap: wrap;
    }
}

/* ---- 角色卡 / 产业 ---- */
@media (max-width: 900px) {
    .charsheet-layout {
        height: auto;
        min-height: 0;
        gap: 12px;
    }

    .charsheet-sidebar {
        max-height: min(40vh, 320px);
        height: auto;
    }

    .charsheet-main {
        height: auto;
        min-height: min(50vh, 480px);
    }

    .charsheet-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 4px;
        scrollbar-width: thin;
    }

    .charsheet-tab {
        flex-shrink: 0;
        padding: 8px 12px;
        font-size: 13px;
    }

    .charsheet-panel {
        padding: 12px 10px;
    }

    .charsheet-grid-3 {
        grid-template-columns: 1fr;
    }

    .charsheet-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .charsheet-title {
        font-size: 22px;
        letter-spacing: 1px;
    }

    .industry-layout {
        gap: 12px;
    }

    .industry-sidebar {
        max-height: min(38vh, 300px);
        overflow-y: auto;
    }

    .industry-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .industry-tab {
        flex-shrink: 0;
        font-size: 13px;
        padding: 8px 12px;
    }

    .industry-panel {
        padding: 14px 12px;
    }

    .industry-title {
        font-size: 22px;
    }
}

@media (max-width: 480px) {
    .charsheet-main-head {
        flex-wrap: wrap;
        gap: 8px;
    }

    .charsheet-active-title {
        font-size: 17px;
    }
}

/* ---- 起源语翻译器 ---- */
@media (max-width: 768px) {
    .origin-panel-head {
        flex-wrap: wrap;
        gap: 8px;
    }

    .origin-panel-actions {
        width: 100%;
        justify-content: flex-end;
    }

    .origin-mode-tabs {
        grid-template-columns: 1fr 1fr;
    }

    .origin-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .origin-chips-row {
        gap: 8px;
    }

    .origin-chip-item {
        max-width: 100%;
    }

    .origin-textarea {
        font-size: 16px;
        min-height: 120px;
    }
}

@media (max-width: 480px) {
    .origin-mode-tabs {
        grid-template-columns: 1fr;
    }

    .origin-stats {
        grid-template-columns: 1fr;
    }
}

