:root {
    --color-primary: #1a2233; /* サイドバー等 */
    --color-secondary: #2a3447;
    --color-accent: #4e73df;
    --color-text-light: #f8f9fc;
    --color-text-dark: #333333;
    --glass-bg: rgba(255,255,255,0.06);
    --glass-border: rgba(255,255,255,0.12);
    --glass-shadow: 0 10px 25px rgba(0,0,0,.35);
    --radius-lg: 12px;

    /* 追加: サイドバー幅 */
    --sidebar-width: 250px;
    --sidebar-width-collapsed: 72px;

    /* 追加: ボトムナビ推定高さ（アイテム+余白+安全域） */
    --bottom-nav-est-height: 80px;
}

/* ここを修正: height:100% -> min-height:100% に変更し、背景は body のみに適用 */
html {
    min-height: 100%;
}

body {
    min-height: 100%;
    background: radial-gradient(1200px 800px at 0% 100%, rgba(232,62,140,.25), transparent 60%), radial-gradient(1200px 800px at 100% 0%, rgba(78,115,223,.25), transparent 60%), linear-gradient(180deg, #0f1724 0%, #121a2a 100%);
    color: var(--color-text-light);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* モバイル時: 固定ボトムメニュー分の余白を確保してコンテンツ被り防止 */
@media (max-width: 991.98px) {
    body {
        padding-bottom: calc(var(--bottom-nav-est-height) + env(safe-area-inset-bottom));
    }
}

a {
    color: #cfd8ff;
}

a:hover {
    color: #ffffff;
}

/* レイアウト骨組み */
.app__wrapper {
    display: flex;
    min-height: 100vh;
    width: 100%;
}

.app__main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.app__content {
    flex: 1 1 auto;
}

/* 折りたたみ時の幅を width と flex-basis 両方に適用 */
.app.sidebar-collapsed .sidebar {
    width: var(--sidebar-width-collapsed);
    flex: 0 0 var(--sidebar-width-collapsed);
}

.app.sidebar-collapsed .sidebar .sidebar__link span,
.app.sidebar-collapsed .sidebar .sidebar__brand span {
    display: none;
}

.app.sidebar-collapsed .sidebar .sidebar__link {
    justify-content: center;
    gap: 0;
    padding: .55rem 0;
}

.app.sidebar-collapsed .app__content,
.app.sidebar-collapsed .topbar {
    transition: margin .2s ease;
}

/* 共通ユーティリティ */
.glass {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    backdrop-filter: blur(10px);
    box-shadow: var(--glass-shadow);
    border-radius: var(--radius-lg);
}

/* ブレークポイント（デスクトップファースト） */
@media (max-width: 1199.98px) {
}

@media (max-width: 991.98px) {
}

@media (max-width: 767.98px) {
}

@media (max-width: 575.98px) {
}

/* モバイル/タブレットでフォーカス時にズームしないように（iOS対策）
   フォーム要素のフォントサイズを16px以上に固定 */
@media (hover: none) and (pointer: coarse) {
  input,
  textarea,
  select,
  .form-control,
  .form-select {
    font-size: 16px !important;
  }
}