/* ==========================================================================
   ICHINGO Tools Hub — redesign
   A single dashboard shell (header + tab rail + panels) shared by every
   smart tool, built entirely from the core design tokens.
   ========================================================================== */

.ichingo-tools-hero {
  position: relative; overflow: hidden; border-radius: var(--ichingo-radius-lg);
  padding: clamp(1.4rem, 3vw, 1.9rem) clamp(1.25rem, 4vw, 2.25rem);
  margin-bottom: 1.5rem; isolation: isolate;
  background: linear-gradient(135deg, #0b3d38 0%, var(--ichingo-color-primary-dark) 45%, var(--ichingo-color-primary) 100%);
  box-shadow: 0 16px 40px -18px rgba(4, 40, 36, .55), 0 2px 8px rgba(0,0,0,.08);
}
/* Subtle dotted "map" texture — restrained, premium, not icon soup. */
.ichingo-tools-hero__pattern {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.16) 1px, transparent 1px);
  background-size: 20px 20px;
  -webkit-mask-image: radial-gradient(ellipse 90% 100% at 50% 0%, #000 55%, transparent 100%);
  mask-image: radial-gradient(ellipse 90% 100% at 50% 0%, #000 55%, transparent 100%);
}
/* A single, large, faint airplane watermark — the "air travel" mood, without clutter. */
.ichingo-tools-hero::before {
  content: '✈'; position: absolute; z-index: 0; pointer-events: none;
  right: -1rem; top: -1.5rem; font-size: clamp(6rem, 14vw, 9rem); line-height: 1;
  color: rgba(255,255,255,.07); transform: rotate(35deg);
}
.ichingo-tools-hero::after {
  content: ''; position: absolute; inset: 0; z-index: 0;
  background: radial-gradient(ellipse at 12% -10%, rgba(255,255,255,.14), transparent 50%);
}
.ichingo-tools-hero__inner { position: relative; z-index: 1; text-align: left; max-width: 560px; }
.ichingo-tools-hero__row { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.4rem; }
.ichingo-tools-hero__orbit { position: relative; width: 150px; height: 130px; flex-shrink: 0; display: none; }
.ichingo-tools-hero__orbit .bubble {
  position: absolute; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: rgba(255,255,255,.16);
  backdrop-filter: blur(4px); border: 1px solid rgba(255,255,255,.22);
  display: flex; align-items: center; justify-content: center; font-size: 1.25rem;
  animation: ichingo-float 5s ease-in-out infinite;
  box-shadow: 0 8px 20px rgba(0,0,0,.18);
}
.ichingo-tools-hero__orbit .b1 { top: 4%; left: 10%; animation-delay: 0s; }
.ichingo-tools-hero__orbit .b2 { top: 40%; left: 55%; animation-delay: -1.1s; width: 3.1rem; height: 3.1rem; font-size: 1.45rem; }
.ichingo-tools-hero__orbit .b3 { top: 65%; left: 8%; animation-delay: -2.3s; }
.ichingo-tools-hero__orbit .b4 { top: 0%; left: 62%; animation-delay: -3.1s; width: 2.2rem; height: 2.2rem; font-size: 1.05rem; }
.ichingo-tools-hero__orbit .b5 { top: 70%; left: 68%; animation-delay: -0.6s; width: 2.2rem; height: 2.2rem; font-size: 1.05rem; }
@keyframes ichingo-float { 0%,100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-10px) rotate(4deg); } }
@media (min-width: 720px) { .ichingo-tools-hero__orbit { display: block; } }
.ichingo-tools-hero .ichingo-tools-hub__eyebrow {
  background: rgba(255,255,255,.14); color: #fff; backdrop-filter: blur(2px);
  font-size: .62rem; padding: .25em .75em; margin-bottom: .5rem;
}
.ichingo-tools-hero h2 { margin: 0 0 .35rem; font-size: clamp(1.3rem, 2.6vw, 1.7rem); color: #fff; letter-spacing: -.01em; }
.ichingo-tools-hero p { margin: 0; color: rgba(255,255,255,.78); font-size: .84rem; max-width: 52ch; line-height: 1.5; }

.ichingo-tools-hub__eyebrow {
  display: inline-flex; align-items: center; gap: .4em;
  font-size: .68rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase;
  padding: .3em .8em; border-radius: var(--ichingo-radius-pill);
  background: var(--ichingo-color-primary-tint); color: var(--ichingo-color-primary-dark);
  margin-bottom: .6rem;
}

.ichingo-tools-hub__tabs-head {
  display: flex; justify-content: flex-end; margin-bottom: .5rem; position: relative; z-index: 1;
}
.ichingo-tools-hub__tabs-count { font-size: .72rem; font-weight: 700; color: rgba(255,255,255,.65); }

.ichingo-tools-hub__tabs {
  display: flex; flex-wrap: wrap; justify-content: flex-start; gap: .4rem;
  position: relative; z-index: 1;
  padding: .4rem; background: rgba(255,255,255,.08); backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--ichingo-radius-lg);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.ichingo-tools-hub__tab {
  display: flex; align-items: center; gap: .55rem;
  padding: .58rem .95rem; border-radius: var(--ichingo-radius-md);
  border: 1px solid transparent; background: transparent; color: rgba(255,255,255,.85);
  font-weight: 700; font-size: .84rem; cursor: pointer; white-space: nowrap;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.ichingo-tools-hub__tab-label { display: block; }
.ichingo-tools-hub__tab-tag {
  display: block; font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .02em;
  color: rgba(255,255,255,.5); margin-top: .1rem;
}
.ichingo-tools-hub__tab.is-active .ichingo-tools-hub__tab-tag { color: var(--ichingo-color-primary); opacity: .75; }
.ichingo-tools-hub__tab .icn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.6rem; height: 1.6rem; border-radius: var(--ichingo-radius-sm);
  background: rgba(255,255,255,.14); font-size: .95rem; flex-shrink: 0;
  transition: background .15s ease;
}
.ichingo-tools-hub__tab:hover { background: rgba(255,255,255,.14); color: #fff; }
.ichingo-tools-hub__tab:active { transform: scale(.97); }
.ichingo-tools-hub__tab.is-active {
  background: #fff; color: var(--ichingo-color-primary-dark);
  box-shadow: var(--ichingo-shadow-sm);
}
.ichingo-tools-hub__tab.is-active .icn { background: var(--ichingo-color-primary-tint); }

.ichingo-tools-hub__panel { display: none; }
.ichingo-tools-hub__panel.is-active { display: block; animation: ichingo-fade-up .3s ease both; }

@media (max-width: 640px) {
  .ichingo-tools-hero { padding: 1.1rem 1rem; border-radius: 16px; }
  .ichingo-tools-hero__row { margin-bottom: 1rem; }
  .ichingo-tools-hero__inner { max-width: 100%; }
  .ichingo-tools-hero h2 { font-size: 1.2rem; }
  .ichingo-tools-hero p { font-size: .78rem; }
  .ichingo-tools-hub__tabs {
    max-width: 100%; overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }
  .ichingo-tools-hub__tab { flex-shrink: 0; }
}

/* ---------- Shared "tool card" section header (icon + title + subtitle) ---------- */
.ichingo-tool-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.1rem; }
.ichingo-tool-head h3 { display: flex; align-items: center; gap: .5rem; margin: 0 0 .2rem; font-size: 1.05rem; }
.ichingo-tool-head p { margin: 0; color: var(--ichingo-text-muted); font-size: .82rem; }

/* ---------- Pill toggle group (currency home-currency, display units, etc.) ---------- */
.ichingo-pill-group { display: inline-flex; gap: .3rem; padding: .25rem; background: var(--ichingo-bg-surface-alt); border-radius: var(--ichingo-radius-pill); flex-wrap: wrap; }
.ichingo-pill-group button {
  border: none; background: transparent; color: var(--ichingo-text-muted); font-weight: 800; font-size: .78rem;
  padding: .45em 1em; border-radius: var(--ichingo-radius-pill); cursor: pointer; transition: background .15s ease, color .15s ease;
}
.ichingo-pill-group button.is-active { background: var(--ichingo-color-primary); color: #fff; }

/* ---------- Generic quick-chip row (amount taps, filters) ---------- */
.ichingo-chip-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.ichingo-quick-chip {
  border: 1px solid var(--ichingo-border-subtle); background: var(--ichingo-bg-surface); color: var(--ichingo-text-ink);
  font-weight: 800; font-size: .82rem; padding: .5em 1em; border-radius: var(--ichingo-radius-pill); cursor: pointer;
  transition: all .15s ease;
}
.ichingo-quick-chip:hover { border-color: var(--ichingo-color-primary); }
.ichingo-quick-chip.is-active { background: var(--ichingo-color-primary); border-color: var(--ichingo-color-primary); color: #fff; }

/* ---------- "Speak / bargain helper" gradient panel (currency tool) ---------- */
.ichingo-speak-panel {
  border-radius: var(--ichingo-radius-lg); padding: 1.4rem;
  background: linear-gradient(150deg, var(--ichingo-color-primary-dark) 0%, var(--ichingo-color-primary) 100%);
  color: #fff; display: flex; flex-direction: column; gap: .6rem; align-items: center; text-align: center;
}
.ichingo-speak-panel .eyebrow { font-size: .65rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; background: rgba(255,255,255,.18); padding: .3em .8em; border-radius: var(--ichingo-radius-pill); }
.ichingo-speak-panel .zh { font-size: clamp(1.6rem, 5vw, 2.2rem); font-weight: 800; font-family: var(--ichingo-font-display), var(--ichingo-font-system); margin: .2rem 0; }
.ichingo-speak-panel .pinyin { font-style: italic; opacity: .85; font-size: .95rem; margin-bottom: .3rem; }
.ichingo-speak-panel button.ichingo-btn {
  background: var(--ichingo-color-accent-gold); color: #1a1408; width: 100%; justify-content: center; font-size: .9rem;
  padding: .9em 1.4em;
}

/* ---------- Phrase list (bargaining / phrasebook rows) with per-row speak icon ---------- */
.ichingo-phrase-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .35rem; }
.ichingo-phrase-row {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  padding: .6rem .75rem; border-radius: var(--ichingo-radius-md); border: 1px solid var(--ichingo-border-subtle);
  font-size: .84rem;
}
.ichingo-phrase-row__text { min-width: 0; }
.ichingo-phrase-row__en { font-weight: 700; }
.ichingo-phrase-row__zh { direction: ltr; color: var(--ichingo-text-muted); margin-top: .15rem; }
.ichingo-phrase-row__zh strong { color: var(--ichingo-text-ink); font-weight: 800; }
.ichingo-speak-icon {
  flex-shrink: 0; border: none; background: var(--ichingo-color-primary-tint); color: var(--ichingo-color-primary-dark);
  width: 2.1rem; height: 2.1rem; border-radius: 50%; cursor: pointer; font-size: .95rem;
  display: inline-flex; align-items: center; justify-content: center; transition: transform .12s ease;
}
.ichingo-speak-icon:hover { transform: scale(1.08); }
.ichingo-speak-icon.is-speaking { animation: ichingo-pulse 1s ease-in-out infinite; }
@keyframes ichingo-pulse { 0%,100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--ichingo-color-primary) 45%, transparent); } 50% { box-shadow: 0 0 0 8px transparent; } }

/* ---------- Category filter chips (phrasebook) ---------- */
.ichingo-cat-tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.ichingo-cat-tabs button {
  border: 1px solid var(--ichingo-border-subtle); background: var(--ichingo-bg-surface); color: var(--ichingo-text-muted);
  font-weight: 700; font-size: .78rem; padding: .4em .9em; border-radius: var(--ichingo-radius-pill); cursor: pointer;
}
.ichingo-cat-tabs button.is-active { background: var(--ichingo-color-primary-tint); border-color: var(--ichingo-color-primary); color: var(--ichingo-color-primary-dark); }

/* ---------- Size converter rows ---------- */
.ichingo-size-rows { border: 1px solid var(--ichingo-border-subtle); border-radius: var(--ichingo-radius-md); overflow: hidden; margin-bottom: 1.5rem; animation: ichingo-fade-up .25s ease both; }
.ichingo-size-row { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: .5rem; padding: .65em .9em; font-size: .84rem; }
.ichingo-size-row:not(:last-child) { border-bottom: 1px solid var(--ichingo-border-subtle); }
.ichingo-size-row--head { background: var(--ichingo-bg-surface-alt); font-weight: 800; font-size: .68rem; text-transform: uppercase; letter-spacing: .03em; color: var(--ichingo-text-muted); }
.ichingo-size-row .cn { font-weight: 800; color: var(--ichingo-color-primary-dark); }
.ichingo-size-row:not(.ichingo-size-row--head):hover { background: var(--ichingo-color-primary-tint); }

/* ---------- Unit converter cards ---------- */
.ichingo-unit-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.ichingo-unit-card {
  display: flex; align-items: center; gap: .6rem; padding: 1rem 1.1rem; border-radius: var(--ichingo-radius-lg);
  background: var(--ichingo-bg-surface); border: 1px solid var(--ichingo-border-subtle); box-shadow: var(--ichingo-shadow-sm);
}
.ichingo-unit-card__icon { font-size: 1.5rem; flex-shrink: 0; }
.ichingo-unit-card__field { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ichingo-unit-card__field input {
  width: 100%; border: none; background: transparent; font-size: 1.2rem; font-weight: 800; color: var(--ichingo-text-ink);
  padding: 0; -moz-appearance: textfield;
}
.ichingo-unit-card__field input:focus:not(:focus-visible) { outline: none; }
.ichingo-unit-card__field label { font-size: .65rem; font-weight: 800; color: var(--ichingo-text-muted); text-transform: uppercase; letter-spacing: .04em; }
.ichingo-unit-card__swap { color: var(--ichingo-color-primary); font-size: 1.1rem; flex-shrink: 0; }

/* ---------- Weather widget ---------- */
.ichingo-weather-card { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.ichingo-weather-card__icon { font-size: 3rem; line-height: 1; }
.ichingo-weather-card__temp { font-size: 2.4rem; font-weight: 900; font-family: var(--ichingo-font-display), var(--ichingo-font-system); }
.ichingo-weather-city-select { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1rem; }

/* ---------- Expense tracker ---------- */
.ichingo-expense-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ichingo-expense-totals .total-card {
  padding: 1.1rem 1.25rem; border-radius: var(--ichingo-radius-lg);
  background: linear-gradient(135deg, var(--ichingo-color-primary-dark), var(--ichingo-color-primary)); color: #fff;
}
.ichingo-expense-totals .total-card.alt { background: var(--ichingo-bg-surface-alt); color: var(--ichingo-text-ink); border: 1px solid var(--ichingo-border-subtle); }
.ichingo-expense-totals .total-card small { opacity: .85; font-weight: 700; text-transform: uppercase; font-size: .65rem; letter-spacing: .05em; }
.ichingo-expense-totals .total-card strong { display: block; font-size: 1.5rem; margin-top: .2rem; }
.ichingo-expense-form { display: flex; gap: .6rem; flex-wrap: wrap; margin: 1rem 0; }
.ichingo-expense-form select, .ichingo-expense-form input { padding: .65em .8em; border-radius: var(--ichingo-radius-sm); border: 1px solid var(--ichingo-border-subtle); background: var(--ichingo-bg-surface); color: var(--ichingo-text-ink); font-size: .85rem; }
.ichingo-expense-form input[type="number"] { width: 110px; }
.ichingo-expense-form input[type="text"] { flex: 1; min-width: 140px; }
.ichingo-expense-list { list-style: none; padding: 0; max-height: 280px; overflow-y: auto; display: flex; flex-direction: column; gap: .4rem; }
.ichingo-expense-row { display: flex; align-items: center; gap: .75rem; padding: .6rem .7rem; border: 1px solid var(--ichingo-border-subtle); border-radius: var(--ichingo-radius-md); font-size: .84rem; }
.ichingo-expense-row__icon { width: 2rem; height: 2rem; border-radius: var(--ichingo-radius-sm); background: var(--ichingo-color-primary-tint); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ichingo-expense-row__body { flex: 1; min-width: 0; }
.ichingo-expense-row__cat { font-weight: 800; }
.ichingo-expense-row__note { color: var(--ichingo-text-muted); font-size: .74rem; }
.ichingo-expense-row__date { color: var(--ichingo-text-muted); font-size: .7rem; }
.ichingo-expense-row__amt { font-weight: 800; text-align: right; white-space: nowrap; }
.ichingo-expense-row__amt small { display: block; font-weight: 500; color: var(--ichingo-text-muted); font-size: .68rem; }
.ichingo-expense-row__del { border: none; background: none; color: var(--ichingo-color-danger); cursor: pointer; font-size: .95rem; flex-shrink: 0; opacity: .6; }
.ichingo-expense-row__del:hover { opacity: 1; }
.ichingo-expense-empty { text-align: center; padding: 2rem 1rem; color: var(--ichingo-text-muted); font-size: .85rem; }

/* ---------- HSR route cards ---------- */
.ichingo-hsr-search { width: 100%; padding: .7em .9em; border-radius: var(--ichingo-radius-md); border: 1px solid var(--ichingo-border-subtle); margin-bottom: 1rem; font-size: .88rem; background: var(--ichingo-bg-surface); color: var(--ichingo-text-ink); }
.ichingo-hsr-route { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem; flex-wrap: wrap; }
.ichingo-hsr-route__path { display: flex; align-items: center; gap: .6rem; font-weight: 800; font-size: 1rem; }
.ichingo-hsr-route__path .sep { color: var(--ichingo-color-primary); }
.ichingo-hsr-route__meta { font-size: .75rem; color: var(--ichingo-text-muted); margin-top: .2rem; }
.ichingo-hsr-route__note { font-size: .72rem; color: var(--ichingo-color-primary-dark); background: var(--ichingo-color-primary-tint); border-radius: var(--ichingo-radius-sm); padding: .4em .6em; margin-top: .5rem; max-width: 46ch; line-height: 1.4; }
.ichingo-hsr-route__fares { display: flex; gap: .9rem; font-size: .78rem; text-align: center; }
.ichingo-hsr-route__fares div strong { display: block; font-size: .95rem; color: var(--ichingo-color-primary-dark); }
.ichingo-hsr-empty { text-align: center; padding: 1.5rem; color: var(--ichingo-text-muted); font-size: .85rem; }

/* v1.1 — calm, task-first hub shell. */
.ichingo-tools-hub{--tools-ink:#173630;--tools-jade:#176f5f;--tools-paper:#fbf8f0;--tools-gold:#eabf58;display:flex;flex-direction:column;gap:1.35rem}.ichingo-tools-hero{margin:0;padding:clamp(1.4rem,3vw,2.5rem);border:1px solid rgba(31,103,88,.17);border-radius:clamp(1.3rem,2.5vw,1.8rem);background:linear-gradient(125deg,#edf5ee 0%,#fbf7ed 58%,#e6f0eb 100%);color:var(--tools-ink);box-shadow:0 22px 55px rgba(31,70,61,.11)}.ichingo-tools-hero:before{content:"";inset:auto -5rem -11rem auto;width:24rem;height:24rem;border:1px solid rgba(23,111,95,.12);border-radius:50%;box-shadow:0 0 0 3rem rgba(23,111,95,.025),0 0 0 7rem rgba(23,111,95,.018);transform:none}.ichingo-tools-hero:after{background:radial-gradient(circle at 20% 0%,rgba(255,255,255,.8),transparent 42%)}.ichingo-tools-hero__pattern{background-image:radial-gradient(rgba(23,111,95,.13) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent 72%)}.ichingo-tools-hero__row{align-items:stretch;margin-bottom:1.2rem}.ichingo-tools-hero__inner{align-self:center;max-width:610px;text-align:start}.ichingo-tools-hero .ichingo-tools-hub__eyebrow{margin-bottom:.8rem;border:1px solid #c7ddd4;background:rgba(255,255,255,.65);color:var(--tools-jade)}.ichingo-tools-hero h2{max-width:13ch;margin:0 0 .65rem;color:var(--tools-ink);font-family:var(--ichingo-font-display);font-size:clamp(2rem,4.5vw,3.5rem);line-height:1.03;letter-spacing:-.04em;text-wrap:balance}.ichingo-tools-hero p{max-width:58ch;color:#58716a;font-size:.92rem;line-height:1.7}.ichingo-tools-hero__visual{position:relative;display:block;width:clamp(14rem,26vw,20rem);min-height:13rem;flex:none}.ichingo-tools-hero__phone{position:absolute;inset:1rem 3.5rem 0 auto;width:8.5rem;height:12rem;border:5px solid #173630;border-radius:1.6rem;background:linear-gradient(145deg,#fffdf8,#dbece4);box-shadow:0 22px 45px rgba(26,71,61,.18);transform:rotate(5deg)}.ichingo-tools-hero__phone:before{content:"";position:absolute;top:.35rem;left:50%;width:2.5rem;height:.35rem;border-radius:1rem;background:#173630;transform:translateX(-50%)}.ichingo-tools-hero__phone span{position:absolute;left:1rem;right:1rem;top:2rem;height:3rem;border-radius:.7rem;background:linear-gradient(135deg,#176f5f,#55a486)}.ichingo-tools-hero__phone i,.ichingo-tools-hero__phone b{position:absolute;left:1rem;right:1rem;display:block;height:.55rem;border-radius:1rem;background:#cadbd4}.ichingo-tools-hero__phone i{top:6rem}.ichingo-tools-hero__phone b{top:7.25rem;right:2.8rem}.ichingo-tools-hero__route{position:absolute;inset:2.3rem 0 auto auto;width:16rem;height:8rem;border:2px dashed rgba(23,111,95,.28);border-width:2px 0 0;border-radius:50%;transform:rotate(-10deg)}.ichingo-tools-hero__route i{position:absolute;width:.65rem;height:.65rem;border:2px solid #fff;border-radius:50%;background:#dba839;box-shadow:0 3px 10px rgba(80,55,10,.2)}.ichingo-tools-hero__route i:nth-child(1){left:0;top:-.4rem}.ichingo-tools-hero__route i:nth-child(2){left:45%;top:-1.3rem}.ichingo-tools-hero__route i:nth-child(3){right:0;top:-.25rem}.ichingo-tools-hero__visual-icon{position:absolute;z-index:2;display:grid;place-items:center;width:3rem;height:3rem;border:1px solid rgba(23,111,95,.15);border-radius:1rem;background:#fff;color:#176f5f;box-shadow:0 12px 26px rgba(28,71,61,.15)}.ichingo-tools-hero__visual-icon svg{width:1.45rem;height:1.45rem}.visual-icon--map{left:.4rem;top:2rem}.visual-icon--rail{right:.3rem;top:5rem}.visual-icon--talk{left:1.8rem;bottom:.4rem}.ichingo-tools-hero__proofs{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;margin:0 0 1.25rem;color:#46665e;font-size:.72rem;font-weight:750}.ichingo-tools-hero__proofs span::first-letter{color:#176f5f}
.ichingo-tools-hub__tabs-head{justify-content:flex-start;margin:.2rem 0 .65rem}.ichingo-tools-hub__tabs-count{color:#6a7e78;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em}.ichingo-tools-hub__tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;padding:0;border:0;background:transparent;box-shadow:none;backdrop-filter:none}.ichingo-tools-hub__tab{position:relative;display:grid;grid-template-columns:2.65rem minmax(0,1fr);grid-template-rows:auto auto;gap:.1rem .7rem;min-width:0;padding:.72rem;border:1px solid #d7e3de;border-radius:.9rem;background:rgba(255,255,255,.64);color:#34574f;text-align:start;white-space:normal}.ichingo-tools-hub__tab .icn{grid-row:1/3;width:2.65rem;height:2.65rem;border-radius:.8rem;background:#e8f2ed;color:#176f5f}.ichingo-tools-hub__tab .icn svg{width:1.35rem;height:1.35rem}.ichingo-tools-hub__tab-label{align-self:end;font-size:.79rem;line-height:1.25}.ichingo-tools-hub__tab-tag{align-self:start;margin:0;color:#778a84;font-size:.57rem;line-height:1.25}.ichingo-tools-hub__tab:hover{border-color:#91b8ab;background:#fff;color:#173630;transform:translateY(-2px)}.ichingo-tools-hub__tab.is-active{border-color:#176f5f;background:#176f5f;color:#fff;box-shadow:0 10px 24px rgba(23,111,95,.19)}.ichingo-tools-hub__tab.is-active .icn{background:rgba(255,255,255,.16);color:#fff}.ichingo-tools-hub__tab.is-active .ichingo-tools-hub__tab-tag{color:rgba(255,255,255,.68)}.ichingo-tools-hub__tab:focus-visible{outline:3px solid #eabf58;outline-offset:3px}.ichingo-tools-hub__panels{min-width:0}.ichingo-tools-hub__panel{padding:clamp(1rem,2vw,1.35rem);border:1px solid #dce6e1;border-radius:1.25rem;background:#fff;box-shadow:0 14px 38px rgba(30,67,59,.07)}.ichingo-tools-hub__panel[hidden]{display:none}.ichingo-tools-hub__panel-intro{display:flex;align-items:center;gap:.8rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid #e3ebe7}.ichingo-tools-hub__panel-intro>.icn{display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:.85rem;background:#eaf4ef;color:#176f5f}.ichingo-tools-hub__panel-intro svg{width:1.4rem}.ichingo-tools-hub__panel-intro h2{margin:0;color:#173630;font-size:1.05rem}.ichingo-tools-hub__panel-intro p{margin:.15rem 0 0;color:#71837d;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em}.ichingo-tools-hub__panel>.ichingo-card{border:0!important;box-shadow:none!important;padding:.3rem!important}.ichingo-tools-hub :is(input,select,textarea){box-sizing:border-box;min-height:2.7rem;border-color:#cfded7!important;border-radius:.7rem!important}.ichingo-tools-hub :is(button,input,select,textarea):focus-visible{outline:3px solid #eabf58!important;outline-offset:2px}.ichingo-tool-head h3{color:#173630;font-size:1.15rem}.ichingo-phrase-row,.ichingo-unit-card,.ichingo-hsr-route,.ichingo-expense-row{border-color:#dce6e1;background:#fcfdfb}.ichingo-phrase-row:hover,.ichingo-hsr-route:hover{background:#f1f7f3}.ichingo-pill-group{border:1px solid #dce6e1;background:#f2f6f3}.ichingo-speak-panel{background:linear-gradient(145deg,#123f38,#207665)}
[dir=rtl] .ichingo-tools-hero__visual{transform:scaleX(-1)}[dir=rtl] .ichingo-tools-hero__visual svg{transform:scaleX(-1)}
@media(max-width:860px){.ichingo-tools-hub__tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.ichingo-tools-hero__visual{width:14rem}}@media(max-width:640px){.ichingo-tools-hero{padding:1.2rem}.ichingo-tools-hero__row{margin-bottom:1rem}.ichingo-tools-hero__visual{display:none}.ichingo-tools-hero h2{font-size:2rem}.ichingo-tools-hero__proofs{display:grid;gap:.35rem}.ichingo-tools-hub__tabs{display:flex;overflow-x:auto;gap:.55rem;padding:.15rem .1rem .55rem;scroll-snap-type:x proximity}.ichingo-tools-hub__tab{min-width:13.5rem;scroll-snap-align:start}.ichingo-tools-hub__panel{padding:.9rem}.ichingo-tools-hub__panel>.ichingo-card{padding:0!important}.ichingo-size-row{min-width:32rem}.ichingo-size-rows{overflow:auto}.ichingo-expense-form>*{width:100%!important}.ichingo-hsr-route__fares{width:100%;justify-content:space-between}}@media(prefers-reduced-motion:reduce){.ichingo-tools-hub *{animation-duration:.01ms!important;transition-duration:.01ms!important}}
