:root{
  --ui-bg:#f6f8fb;
  --ui-surface:#ffffff;
  --ui-soft:#f3f6fb;
  --ui-line:#dbe3ee;
  --ui-line-strong:#b8c5d6;
  --ui-text:#111827;
  --ui-muted:#4b5563;
  --ui-blue:#2563eb;
  --ui-blue-dark:#1e40af;
  --ui-radius:8px;
  --ui-shadow:0 1px 2px rgba(15,23,42,.05),0 14px 36px rgba(15,23,42,.08);
}

html{
  text-size-adjust:100%;
}

body{
  background-color:var(--ui-bg);
  color:var(--ui-text);
  letter-spacing:0;
}

button,
input,
select,
textarea{
  font:inherit;
}

input,
select,
textarea{
  border-radius:var(--ui-radius) !important;
}

.card,
.panel,
.side-card,
.article,
.section,
.section-card,
.tool-card,
.faq,
.faq-item,
.faq-card,
.main-card,
.result-card,
.mini-card,
.stat-card,
.drop-zone,
.content-card,
.input-card,
.output-card,
.page-intro,
.hero,
.hero-copy,
.hero-panel,
.intro-panel,
.guide-banner{
  border-radius:var(--ui-radius) !important;
}

.card,
.panel,
.side-card,
.article,
.section,
.section-card,
.tool-card,
.faq-item,
.faq-card,
.main-card,
.mini-card,
.stat-card,
.content-card,
.input-card,
.output-card{
  box-shadow:0 1px 2px rgba(15,23,42,.04) !important;
}

.btn,
.main-btn,
.copy-btn,
.rate-btn,
.mode-btn,
.tab-btn,
.nav-link,
.nav-trigger,
.lang-trigger,
.lang-button,
.button,
.primary-btn,
.secondary-btn,
.download-btn,
.chip,
.tag,
.badge{
  border-radius:var(--ui-radius) !important;
}

.btn,
.main-btn,
.copy-btn,
.rate-btn,
.mode-btn,
.tab-btn,
.button,
.primary-btn,
.secondary-btn,
.download-btn{
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease;
}

.btn:hover,
.main-btn:hover,
.copy-btn:hover,
.rate-btn:hover,
.mode-btn:hover,
.tab-btn:hover,
.button:hover,
.primary-btn:hover,
.secondary-btn:hover,
.download-btn:hover{
  transform:translateY(-1px);
}

.tool-card,
.card,
.side-card{
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.tool-card:hover,
.card:hover{
  border-color:#9db9f2 !important;
  box-shadow:0 12px 26px rgba(15,23,42,.09) !important;
}

.nav,
.site-header{
  backdrop-filter:blur(18px);
  border-bottom-color:rgba(219,227,238,.9) !important;
}

.dropdown,
.lang-dropdown{
  border-radius:var(--ui-radius) !important;
  box-shadow:0 18px 42px rgba(15,23,42,.14) !important;
}

h1,
h2,
h3,
.brand-title{
  letter-spacing:0 !important;
}

@media (max-width:760px){
  .wrap,
  .container{
    width:calc(100% - 28px) !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  h1{
    font-size:2.1rem !important;
    line-height:1.08 !important;
  }

  .card,
  .panel,
  .side-card,
  .article,
  .section,
  .section-card,
  .tool-card,
  .faq-item,
  .faq-card,
  .main-card,
  .hero,
  .hero-copy,
  .hero-panel,
  .intro-panel,
  .guide-banner{
    padding:18px !important;
  }

  .nav-links,
  .main-nav{
    gap:8px !important;
  }
}
