/* ============================================================
   行動版 / 平板版 全站調整
   在 _base.html 最後載入（各頁 CSS 之後），確保覆蓋。
   原則：觸控目標 ≥ 44px、正文 ≥ 12px、輸入框 16px（避免 iOS 聚焦縮放）、
   留白收斂、首屏內容前移、iOS 安全區。
   ============================================================ */

/* [hidden] 一律隱藏 —— 修正 .gallery-image-preview 等 display:flex 蓋掉 hidden 的問題 */
[hidden] { display: none !important; }

/* ── 平板（≤ 1024px）── */
@media (max-width: 1024px) {
    .container { padding: 0 var(--space-lg); }
    .page-header { padding: var(--space-2xl) 0 var(--space-lg); }
    .home-content { padding-top: var(--space-2xl); }
    .about-hero { padding: var(--space-3xl) 0 var(--space-2xl); }
    .ev-next { grid-template-columns: 1fr; }
    .ev-next-right { align-items: flex-start; }
    .ev-next-actions { justify-content: flex-start; }
    .home-cta-inner { grid-template-columns: 1fr; }
    .home-cta-stats { justify-content: flex-start; gap: var(--space-2xl); }
    .search-gallery-grid { grid-template-columns: repeat(3, 1fr); }
    /* 平板也是觸控裝置：主要按鈕放大 */
    .filter-btn, .sort-btn, .wx-site-btn { min-height: 40px; }
    .btn { min-height: 40px; }
}

/* ── 手機（≤ 768px）── */
@media (max-width: 768px) {
    /* 版面留白 */
    .container { padding: 0 var(--space-md); }
    .page-header { padding: var(--space-xl) 0 var(--space-md); }
    .page-header h1 { font-size: 1.35rem; }
    .page-header p { font-size: 0.86rem; }
    .home-section { margin-bottom: var(--space-2xl); }
    .site-footer { margin-top: var(--space-3xl); padding-bottom: calc(var(--space-lg) + env(safe-area-inset-bottom, 0px)); }
    main { padding-bottom: env(safe-area-inset-bottom, 0px); }

    /* 導覽列：按鈕 ≥ 40px，品牌名縮短空間 */
    .navbar-ctrl-btn, .navbar-hamburger, .navbar-user-btn { width: 40px; height: 40px; padding: 0; justify-content: center; }
    .navbar-ctrl-btn svg, .search-toggle-btn svg { width: 18px; height: 18px; }
    .navbar-hamburger svg { width: 22px; height: 22px; }
    .navbar-user-btn .avatar { width: 32px; height: 32px; }
    .navbar-controls { gap: 0; }
    .navbar-login-btn { width: 40px; height: 40px; padding: 0; justify-content: center; }
    .navbar-login-btn svg { width: 18px; height: 18px; }
    .navbar-brand-name { font-size: 0.8rem; }
    /* 抽屜選單項目更大、更好點 */
    .navbar-links > li > a { padding: 15px 14px; font-size: 1.02rem; }
    .nav-dropdown a { padding: 13px 12px 13px 36px; font-size: 0.95rem; }

    /* 觸控目標 ≥ 44px */
    .filter-btn { min-height: 44px; padding: 8px 16px; font-size: 0.82rem; }
    .sort-btn { min-height: 38px; padding: 6px 14px; font-size: 0.78rem; }
    .gallery-sort { padding: 3px; }
    .btn { min-height: 44px; padding: 10px 18px; font-size: 0.86rem; }
    .btn svg { width: 16px; height: 16px; }
    .home-more { min-height: 44px; padding: 8px 4px 8px 8px; margin-right: -8px; font-size: 0.82rem; }
    .footer-col { gap: 0; }
    .footer-col a { min-height: 44px; display: flex; align-items: center; font-size: 0.86rem; width: 100%; }
    .footer-col-title { margin-bottom: 4px; }
    .footer-social-btn { width: 44px; height: 44px; }
    .footer-social-btn svg { width: 17px; height: 17px; }
    .social-btn, .social-views { min-height: 44px; padding: 8px 12px; }
    .social-ic { width: 18px; height: 18px; }
    .feed-action-btn { min-height: 40px; padding: 8px 12px; font-size: 0.8rem; }
    .comment-del { opacity: 1; width: 36px; height: 36px; }
    .comment-submit { min-height: 44px; }
    .ev-action { min-height: 40px; padding: 6px 4px; font-size: 0.78rem; }
    .about-card-link { display: inline-flex; align-items: center; min-height: 44px; }
    .lightbox-close { width: 48px; height: 48px; top: calc(var(--space-md) + env(safe-area-inset-top, 0px)); right: var(--space-md); }
    .search-box-kbd { display: none; }
    .search-hint { min-height: 40px; padding: 8px 14px; font-size: 0.8rem; }
    .wx-info { width: 22px; height: 22px; font-size: 0.72rem; margin-left: 6px; position: relative; }
    .wx-info::before { content: ''; position: absolute; inset: -11px; }   /* 看起來小、點得到 44px */
    .wx-refresh-btn { height: 44px; padding: 0 16px; }
    .wx-map-btn { min-height: 40px; padding: 6px 12px; }
    .loc-act { width: 40px; height: 40px; }
    .tag-chip-x { width: 26px; height: 26px; }
    .tag-suggest-btn { min-height: 40px; padding: 8px 14px; font-size: 0.82rem; }
    .md-tb-btn { min-width: 40px; height: 40px; }
    .md-tb-hint { display: none; }
    .equip-remove { width: 26px; height: 26px; }

    /* 文字下限（~12px） */
    .eyebrow, .wx-eyebrow, .section-title { font-size: 0.74rem; }
    .badge { font-size: 0.74rem; padding: 3px 9px; }
    .copyright, .footer-copy, .footer-credits, .footer-sub { font-size: 0.74rem; }
    .hero-scroll { font-size: 0.72rem; letter-spacing: 0.12em; }
    .hero-subtitle { font-size: 0.72rem; }
    .bottom-bar-left .lab-link, .bottom-info { font-size: 0.76rem; }
    .hn-date, .he-left, .he-month, .ev-card-wd, .ev-cd-lbl, .mini-stats, .member-joined, .member-stats,
    .gallery-info-meta, .feed-post-time, .comment-meta, .comment-hint, .sl-sub, .sg-meta, .fav-sub,
    .wx-stat-name, .wx-hero-elev, .wx-stats-src, .wx-updated, .wx-tile-src, .wx-legend, .wx-bd-name,
    .wx-layer-name, .wx-fact-label, .wx-dark-cap, .hw-note, .hw-facts, .hw-elev, .hw-score-lbl,
    .form-help, .field-status, .pw-reqs li, .wallet-stat-label, .wallet-unit, .loc-coords,
    .team-handle, .member-handle, .profile-handle, .about-stat-lbl, .home-cta-lbl,
    .ts-tile-item, .ts-vis-coord, .gallery-file-row, .md-body code { font-size: max(0.76rem, 12px); }
    .navbar-ctrl-btn.lang-toggle-btn { font-size: 0.76rem; }

    /* 表單：16px 避免 iOS 聚焦縮放；欄位更高 */
    input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]), select, textarea,
    .form-input, .comment-input, .tag-input input, .search-form input, .search-box-row input, .members-search input {
        font-size: 16px !important;
    }
    .form-input, .comment-input { padding: 12px 14px; }
    select.form-input { min-height: 48px; }
    .auth-submit { min-height: 48px; }
    .auth-card { padding: var(--space-xl) var(--space-lg); }
    .auth-page { padding: var(--space-lg) var(--space-md); min-height: auto; }
    .publish-toggle { min-height: 44px; }
    .publish-toggle input { width: 20px; height: 20px; }
    input[type="file"].form-input { padding: 10px; }

    /* 首頁 hero：底部資訊精簡、避免與捲動提示重疊 */
    .hero-title { padding-top: 28vh; }
    .hero-scroll { bottom: 132px; }
    .bottom-bar { padding: 0 var(--space-md) calc(var(--space-md) + env(safe-area-inset-bottom, 0px)); }
    .bottom-bar-center .bg-caption:not(.photo-credit-line) { display: none; }
    .bottom-info { gap: 6px; }
    .hg-grid { grid-auto-rows: 150px; }
    .hw-card { min-height: 0; }

    /* 天氣頁：站點按鈕改成單行橫向滑動；區塊留白收斂 */
    .weather-page { padding-top: var(--space-sm); }
    .wx-wrap { width: 100%; padding: 0 var(--space-md); }
    .wx-head { padding-top: var(--space-sm); gap: var(--space-sm); }
    .wx-head h1 { font-size: 1.4rem; }
    .wx-head-right { width: 100%; justify-content: space-between; }
    .wx-site-select {
        flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity; scrollbar-width: none;
        margin: var(--space-md) calc(-1 * var(--space-md)); padding: 2px var(--space-md) 6px;
        mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 20px), transparent);
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 20px), transparent);
    }
    .wx-site-select::-webkit-scrollbar { display: none; }
    .wx-site-btn { flex: 0 0 auto; scroll-snap-align: start; min-height: 44px; padding: 8px 16px; white-space: nowrap; }
    .wx-hero { padding: var(--space-lg) var(--space-md); }
    .wx-hero-temp { font-size: 3.2rem; }
    .wx-card { padding: var(--space-md); }
    .wx-hourly-scroll { margin: 0 calc(-1 * var(--space-md)); padding: 0 var(--space-md); }
    .wx-hour { width: 64px; }
    .wx-map-frame-wrap { aspect-ratio: 4 / 3; }
    .wx-map-frame { min-height: 0; }
    .wx-dark-row { gap: 8px; }
    .wx-dark-item { min-width: calc(50% - 8px); }
    .wx-obs-score { flex-direction: column; align-items: flex-start; gap: var(--space-sm); }
    .wx-custom-box { max-height: 92vh; overflow-y: auto; }

    /* 藝廊 */
    .gallery-detail-image-btn { max-height: 60vh; }
    .gallery-meta-grid { padding: var(--space-md); }
    .gallery-file-row { flex-direction: column; align-items: flex-start; gap: 6px; }
    .gallery-download { min-height: 40px; }
    .gallery-thumb-badge, .gallery-thumb-fmt { font-size: 0.72rem; }

    /* 消息 */
    .feed-post { padding: var(--space-md) 0; }
    .feed-post-avatar { width: 34px; height: 34px; }
    .feed-post-title { font-size: 0.98rem; }
    .feed-post-excerpt { font-size: 0.86rem; }
    .post-detail-title { font-size: 1.35rem; }

    /* 行事曆 */
    .ev-next { padding: var(--space-lg) var(--space-md); }
    .ev-cd-unit { min-width: 0; flex: 1; }
    .ev-countdown { width: 100%; }
    .ev-cd-num { font-size: 2rem; }
    .ev-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--space-md)); padding: 0 var(--space-md) 4px; }
    .ev-filters::-webkit-scrollbar { display: none; }
    .ev-filters .filter-btn { flex: 0 0 auto; white-space: nowrap; }
    .ev-month-num { font-size: 1.8rem; }

    /* 關於 / 成員 / 搜尋 */
    .about-flag { width: 60px; height: 60px; }
    .about-stats { width: 100%; justify-content: space-around; gap: var(--space-md); }
    .about-cta-inner { padding: var(--space-xl) var(--space-md); }
    .about-cta-actions .btn, .home-cta-actions .btn { flex: 1 1 auto; justify-content: center; }
    .members-header { flex-direction: column; align-items: flex-start; gap: 4px; }
    .member-cover { height: 72px; }
    .search-form { padding: 4px 4px 4px 14px; }
    .search-form .btn { min-height: 44px; padding: 8px 14px; }
    .search-gallery-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-sm); }

    /* 個人檔案 */
    .profile-avatar .avatar-xl { width: 100px; height: 100px; }
    .profile-name { font-size: 1.2rem; }
    .dash-card { padding: var(--space-md); }
    .wallet-amount { font-size: 1.7rem; }
    .profile-works { grid-template-columns: repeat(3, 1fr); gap: 6px; }
    .fav-list { grid-template-columns: 1fr; }

    /* 工具頁 */
    .tool-detail-header { flex-direction: row; align-items: center; gap: var(--space-sm); }
    .tool-detail-title { font-size: 1.15rem; }
    .ts-mapviewport { height: min(420px, 62vh); }
    /* Aladin Lite 自帶的視野角度 / 圖層標籤在窄螢幕會重疊：縮小並靠邊 */
    .ts-mapviewport .aladin-fov { font-size: 11px !important; max-width: 46% !important; overflow: hidden; text-overflow: ellipsis; }
    .ts-mapviewport .aladin-location { font-size: 11px !important; }
    .ts-mapviewport .aladin-layersControl, .ts-mapviewport .aladin-stack-control { transform: scale(0.85); transform-origin: bottom right; }

    /* Toast 與搜尋浮層留安全區 */
    .toast-wrap { bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
    .search-overlay { padding-top: calc(8vh + env(safe-area-inset-top, 0px)); }
    .search-box-hints { padding: 10px 12px; }
}

/* ── 小手機（≤ 400px）── */
@media (max-width: 400px) {
    .navbar-brand-name { max-width: 128px; }
    .hero-title h1 { font-size: 3.4rem; letter-spacing: 6px; }
    .hero-logo-row { gap: 10px; }
    .wx-stats-grid { gap: 8px; }
    .wx-forecast { grid-template-columns: repeat(3, 1fr); }
    .home-cta-stats { gap: var(--space-lg); }
    .ev-cd-sep { display: none; }
    .ev-cd-unit { flex: 1; }
}

/* ── 觸控裝置（不論寬度）：hover 才出現的操作改為常駐 ── */
@media (hover: none) and (pointer: coarse) {
    .loc-actions, .comment-del, .gallery-zoom-hint, .hg-overlay, .pw-overlay { opacity: 1; }
    .navbar-links > li:hover > .nav-dropdown { pointer-events: auto; }
    /* 卡片 hover 位移在觸控上只會閃一下，關掉 */
    .gallery-item:hover, .ev-card:hover, .member-card:hover, .about-card:hover, .hn-item:hover,
    .hw-card:hover, .team-card:hover, .sg-card:hover, .he-item:hover { transform: none; }
}

/* ── 補充：稽核找出的小字來源（≤ 768px）── */
@media (max-width: 768px) {
    .wx-hour-time, .wx-hour-cloudval, .wx-hour-pop, .wx-fc-cond, .wx-fc-score-lbl, .wx-fc-wind,
    .wx-bd-head, .wx-bd-val, .wx-stat-sub, .wx-tile-code, .wx-mb-cap, .wx-section-src, .wx-source-note,
    .wx-cust-field, .wx-custom-hint, .wx-custom-save, .wx-verdict-label, .wx-obs-score-max,
    .ev-chip, .ev-zhr, .ev-tag-tw, .ev-next-label, .footer-col-title, .search-box-hints-label,
    .about-tl-year, .team-role, .profile-role, .comment-role, .tag-suggest-label, .hw-score-lbl,
    .gallery-meta-label, .wx-hero-elev, .status-dot, .dash-count, .inv-chip { font-size: max(0.76rem, 12px); }
    .wx-hour { width: 68px; }
    /* 抽屜內的搜尋（桌機隱藏） */
    .nav-mobile-only { display: block; }
}
@media (min-width: 769px) { .nav-mobile-only { display: none !important; } }

/* ── 窄手機（≤ 480px）：導覽列右側放不下 → 搜尋移進抽屜、按鈕 36px ── */
@media (max-width: 480px) {
    .search-toggle-btn { display: none; }
    .navbar-ctrl-btn, .navbar-hamburger, .navbar-user-btn, .navbar-login-btn { width: 36px; height: 36px; }
    .navbar-user-btn .avatar { width: 30px; height: 30px; }
    .navbar-right { gap: 4px; }
    .site-navbar .container { gap: var(--space-sm); }
}