/* Mindex Smooth lightweight common stylesheet
   分割後の共通層だけを残す。
   道具箱・付箋/枠・編集シート系は、それぞれ
   mindex-toolbox.css / mindex-cards.css / mindex-sheets.css に任せる。
*/

/* =========================================================
   Topbar / brand home / settings button
   ========================================================= */

.topbar{
  min-height:62px;
  background:rgba(246,242,232,.90);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.topbarSplit{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  overflow:hidden !important;
}

.topbarSplit > .brandHome{
  flex:1 1 auto !important;
  min-width:0 !important;
  max-width:none !important;
  margin-right:auto !important;
}

.topbarSplit > *{
  white-space:nowrap;
}

.brandHome{
  cursor:pointer;
  user-select:none;
  transition:transform .12s ease, opacity .12s ease;
}

.brandHome:active{
  transform:scale(.985);
  opacity:.78;
}

.brandHome:focus-visible{
  outline:3px solid rgba(47,111,115,.24);
  outline-offset:3px;
}

.brandHome small{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

.topActions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  margin-left:auto;
}

.topSettingsBtn{
  min-height:40px;
  padding:9px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(216,207,193,.86);
  color:rgba(30,27,22,.76);
  box-shadow:0 3px 10px rgba(30,27,22,.06);
  font-size:13px;
  font-weight:900;
  -webkit-tap-highlight-color:transparent;
  transition:transform .12s ease, background .12s ease;
}

.topSettingsBtn:active{
  transform:scale(.97);
}

@media (max-width:520px){
  .topbarSplit{
    gap:8px !important;
  }

  .topbarSplit > .brandHome{
    min-width:118px !important;
    max-width:calc(100vw - 118px) !important;
  }

  .brandHome{
    font-size:15px;
  }

  .brandHome small{
    font-size:10px;
    line-height:1.18;
  }

  .topSettingsBtn{
    min-height:38px;
    padding:8px 12px;
    font-size:12px;
  }
}

/* =========================================================
   Empty-board hint
   ========================================================= */

.hint{
  max-width:300px;
  border-style:solid;
  background:rgba(255,252,243,.95);
  color:rgba(30,27,22,.76);
}

.hint b{
  color:var(--accent);
}

/* =========================================================
   Save reassurance
   ========================================================= */

.saveReassurance{
  position:fixed;
  right:14px;
  bottom:calc(84px + var(--safeBottom));
  z-index:70;
  min-width:190px;
  max-width:min(320px, calc(100vw - 28px));
  padding:12px 14px 12px 13px;
  border-radius:20px;
  background:rgba(255,252,243,.96);
  border:1px solid rgba(47,111,115,.20);
  box-shadow:0 12px 26px rgba(30,27,22,.13);
  color:rgba(30,27,22,.82);
  display:none;
  align-items:center;
  gap:10px;
  pointer-events:none;
}

.saveReassurance.show{
  display:flex;
  animation:saveReassuranceIn .22s ease-out both;
}

.saveReassurance.hide{
  display:flex;
  animation:saveReassuranceOut .18s ease both;
}

.saveReassuranceIcon{
  width:30px;
  height:30px;
  border-radius:50%;
  background:var(--accent);
  color:#fff;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  box-shadow:0 5px 12px rgba(47,111,115,.22);
  font-weight:900;
}

.saveReassuranceText{
  display:grid;
  gap:1px;
  min-width:0;
}

.saveReassuranceTitle{
  font-size:13px;
  font-weight:900;
  color:var(--accent);
  line-height:1.25;
}

.saveReassuranceSub{
  font-size:11px;
  color:var(--muted);
  line-height:1.35;
}

@keyframes saveReassuranceIn{
  from{
    opacity:0;
    transform:translateY(10px) scale(.97);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes saveReassuranceOut{
  from{
    opacity:1;
    transform:translateY(0) scale(1);
  }
  to{
    opacity:0;
    transform:translateY(8px) scale(.98);
  }
}

@media (max-width:520px){
  .saveReassurance{
    left:14px;
    right:14px;
    bottom:calc(76px + var(--safeBottom));
    max-width:none;
  }
}

@media (prefers-reduced-motion: reduce){
  .brandHome,
  .topSettingsBtn{
    transition:none;
  }

  .saveReassurance.show,
  .saveReassurance.hide{
    animation:none;
  }
}

/* ── Smooth v1.0xx: prevent accidental zoom on top actions ── */
/* Mindexロゴ（ボードへ戻る）と右上設定も、連続タップ時の誤ズームを抑える */
.brandHome,
.topSettingsBtn{
  touch-action:manipulation;
  -webkit-user-select:none;
  user-select:none;
}