
/* Tsutatsu Catalog Gate UI (scoped) */
.tsu-gate{
  max-width: 820px;
  margin: 0 auto;
  padding: 28px 14px;
}
.tsu-gate__card{
  position: relative;
  background: #fff;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 18px;
  padding: 22px 22px 18px;
  box-shadow: 0 14px 40px rgba(15,23,42,.08);
  overflow:hidden;
}
.tsu-gate__card:before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:6px;
  background: linear-gradient(90deg, rgba(15,23,42,.85), rgba(59,130,246,.85));
  opacity:.22;
}
.tsu-gate__head{ display:grid; gap:8px; margin-bottom:14px; }
.tsu-gate__badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color: rgba(15,23,42,.70);
}
.tsu-gate__badge:before{
  content:"";
  width:10px; height:10px;
  border-radius:999px;
  background: rgba(59,130,246,.85);
  box-shadow:0 0 0 6px rgba(59,130,246,.12);
}
.tsu-gate__title{
  margin:0;
  font-size:22px;
  line-height:1.25;
  color: rgba(15,23,42,.92);
}
.tsu-gate__desc{
  margin:0;
  font-size:13px;
  line-height:1.7;
  color: rgba(15,23,42,.72);
}
.tsu-gate__alert{
  border-radius: 14px;
  padding: 10px 12px;
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.6;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  color: rgba(15,23,42,.78);
}
.tsu-gate__alert--error{
  border-color: rgba(225,29,72,.20);
  background: rgba(225,29,72,.06);
  color: rgba(136,19,55,.92);
}
.tsu-gate__form{ margin-top: 6px; }
.tsu-gate__grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.tsu-gate__field{ display:block; margin:0; }
.tsu-gate__label{
  display:block;
  font-size:12px;
  letter-spacing:.06em;
  color: rgba(15,23,42,.70);
  margin:0 0 6px;
}
.tsu-gate__input{
  width:100% !important;
  box-sizing:border-box !important;
  padding: 12px 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(15,23,42,.14) !important;
  background: rgba(248,250,252,.9) !important;
  color: rgba(15,23,42,.92) !important;
  box-shadow:none !important;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.tsu-gate__input:focus{
  outline:none !important;
  border-color: rgba(59,130,246,.55) !important;
  background: #fff !important;
  transform: translateY(-1px);
}
.tsu-gate__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top: 14px;
}
.tsu-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  text-decoration:none !important;
  border:1px solid rgba(15,23,42,.14) !important;
  box-shadow:none !important;
  font-weight:600;
  letter-spacing:.02em;
}
.tsu-btn--primary{
  background: rgba(15,23,42,.92) !important;
  color: #fff !important;
  border-color: rgba(15,23,42,.92) !important;
}
.tsu-btn--ghost{
  background:#fff !important;
  color: rgba(15,23,42,.92) !important;
}
.tsu-gate__list{ display:grid; gap:10px; margin-top: 10px; }
.tsu-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding: 14px 14px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:14px;
  background: rgba(248,250,252,.7);
  text-decoration:none !important;
}
.tsu-item:hover{ background:#fff; }
.tsu-item__left{ display:flex; gap:12px; align-items:center; }
.tsu-item__icon{
  width:44px; height:44px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  letter-spacing:.06em;
  background: rgba(15,23,42,.92);
  color:#fff;
}
.tsu-item__title{ font-size:14px; font-weight:700; color: rgba(15,23,42,.92); }
.tsu-item__sub{ font-size:12px; color: rgba(15,23,42,.62); margin-top:2px; }
.tsu-item__cta{
  font-size:12px;
  padding: 8px 12px;
  border-radius: 999px;
  border:1px solid rgba(15,23,42,.14);
  color: rgba(15,23,42,.85);
  background:#fff;
}
.tsu-gate__logout{ margin-top: 14px; }

@media (max-width: 640px){
  .tsu-gate__card{ padding: 18px 16px 16px; }
  .tsu-gate__grid{ grid-template-columns:1fr; }
  .tsu-btn{ width:100%; }
  .tsu-item{ align-items:flex-start; }
  .tsu-item__cta{ align-self:center; }
}
