/* Local module UI and guide; no other module styles. */
.button:hover {
  opacity: .85;
}

.faq-answer p:last-child,
.article-section>p:last-child,
.article-section>ol:last-child,
.article-section>ul:last-child {
  margin-bottom: 0;
}



.centered-heading .category-badge {
  margin-bottom: 16px;
}

.workspace {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 28px;
  margin: 0 auto 40px;
  background: var(--bg);
  max-width: 1000px;
  @media (max-width:640px) {
    padding: 18px;
    margin-bottom: 28px;
  }
}

.workspace label {
  display: block;
  font-weight: bold;
  margin-bottom: 7px;
}

.workspace input:not([type=checkbox]),
.workspace select {
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 11px 12px;
  background: var(--bg);
  width: 100%;
  min-height: 46px;
  min-width: 0;
}

.workspace textarea {
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 11px 12px;
  background: var(--bg);
  width: 100%;
  min-width: 0;
  resize: vertical;
  min-height: 230px;
  line-height: 1.6;
}

.workspace input::placeholder,
.workspace textarea::placeholder {
  color: var(--muted);
  opacity: 1;
}

.actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 16px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--bg);
  border-radius: 5px;
  padding: 10px 20px;
  min-height: 44px;
  font-weight: bold;
  line-height: 1.3;
}

.button.secondary {
  background: transparent;
  color: var(--ink);
  border-color: var(--line);
}

.status {
  min-height: 1.6em;
  margin: 12px 0 0;
  font-size: 15px;
  color: var(--muted);
}

.metrics {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
  margin-bottom: 22px;
  @media (max-width:640px) {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
  }
}

.metric {
  background: var(--soft);
  border: 1px solid var(--line);
  padding: 16px;
  border-radius: 6px;
  @media (max-width:640px) {
    padding: 12px;
  }
}

.metric strong {
  display: block;
  font-size: 28px;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  overflow-wrap: anywhere;
  @media (max-width:640px) {
    font-size: 27px;
  }
}

.metric span,
.fine-print,
.legal-date {
  font-size: 14px;
  color: var(--muted);
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  @media (max-width:640px) {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

.article {
  max-width: 780px;
  margin: 36px auto 0;
  font-size: 18px;
  line-height: 1.75;
  @media (max-width:640px) {
    font-size: 17px;
  }
}

.article h2 {
  margin-top: 34px;
  border-left: 2px solid var(--ink);
  padding-left: 16px;
  font-size: clamp(1.4rem,3vw,1.8rem);
  @media (max-width:640px) {
    font-size: 26px;
  }
}

.article h3 {
  margin-top: 26px;
}

.article a,
.text-link {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.article ul,
.article ol {
  padding-left: 24px;
}

.category-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--ink);
  border-radius: 99px;
  padding: 5px 12px;
  font-size: 11px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--bg);
}

.editorial-heading {
  max-width: 680px;
  margin: 0 auto;
  text-align: center;
  padding: 14px 0 0;
  @media (max-width:768px) {
    padding-top: 8px;
  }
}

.editorial-heading h1 {
  font-size: clamp(1.75rem,3.5vw,2.6rem);
  line-height: 1.25;
  margin: 0 0 12px;
  letter-spacing: -.025em;
}

.editorial-heading>p {
  max-width: 680px;
  margin: 0 auto 16px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.5;
}









.byline {
  font-size: 12px;
  color: var(--muted);
  margin: 0;
  line-height: 1.6;
}

.article .steps {
  list-style: none;
  counter-reset: steps;
  padding: 0;
  display: grid;
  gap: 12px;
  margin: 24px 0;
}

.steps>li {
  counter-increment: steps;
  position: relative;
  min-height: 70px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px 18px 18px 64px;
  background: var(--bg);
  font-size: 17px;
  line-height: 1.6;
  transition: border-color .15s;
  @media (prefers-reduced-motion:reduce) {
    transition: none;
  }
}

.steps>li::before {
  content: counter(steps,decimal-leading-zero);
  position: absolute;
  top: 18px;
  left: 16px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--ink);
  border-radius: 50%;
  font-weight: bold;
  font-size: 13px;
  line-height: 1;
}

.steps>li:hover {
  border-color: var(--ink);
}

.article .faq-item {
  padding: 0;
  margin: 0;
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  scroll-margin-top: 72px;
}

.faq-item:first-of-type {
  border-top: 1px solid var(--line);
}

.article .faq-item summary {
  display: flex;
  align-items: center;
  gap: 18px;
  list-style: none;
  cursor: pointer;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.45;
  padding: 20px 2px;
  @media (max-width:768px) {
    font-size: 17px;
    gap: 12px;
  }
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary::marker {
  content: "";
}

.faq-item summary>span:first-child {
  flex: 1;
  min-width: 0;
}

.faq-chevron {
  margin-left: auto;
  flex: none;
  transition: transform .2s;
  width: 18px;
  height: 18px;
  @media (prefers-reduced-motion:reduce) {
    transition: none;
  }
}

.faq-item[open]:not([data-closing]) .faq-chevron {
  transform: rotate(180deg);
}

.faq-answer {
  padding: 0 32px 20px 2px;
  color: var(--muted);
}

.faq-answer p {
  margin: 0 0 12px;
}

.faq-item summary:focus-visible {
  outline-offset: -2px;
}

.article-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 32px 0;
  padding: 20px;
  @media (max-width:768px) {
    align-items: start;
    flex-direction: column;
  }
}

.article-cta p {
  margin: 0;
  flex: 1;
  min-width: 180px;
}

.article-cta .button {
  text-decoration: none;
}

.formula {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 6px;
  text-align: center;
  font-size: 20px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}











.article .steps>li {
  @media (max-width:768px) {
    padding-right: 14px;
    font-size: 16px;
  }
}

.faq-chevron:empty::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor;
  transform: rotate(45deg);
  margin: 2px 4px;
}

.editorial-heading>.category-badge {
  margin-bottom: 8px;
}



























































.article-launch {
  max-width: 680px;
  text-align: center;
  margin: 0 auto 12px;
}

.article-launch .button {
  min-height: 0;
  padding: 8px 18px;
  line-height: 1.25;
  font-size: 14px;
}











































@media (max-width: 768px) {.feature-breakdown { grid-template-columns: minmax(0, 1fr); gap: 16px; }.feature-heading { margin-top: 24px; }.feature-section { padding: 20px; }}























:root { --cc-text: #0d1420; --cc-muted: #66707d; --cc-surface: #ffffff; --cc-soft: #f7f8fa; --cc-soft-2: #eef1f4; --cc-border: #d8dde4; --cc-border-strong: #c8ced7; --cc-dark: #0b0f12; --cc-dark-2: #20262c; --cc-shadow: 0 12px 32px rgba(11,15,18,.07); --cc-radius: 18px; --cc-control-radius: 14px; --heading-color: #111827; }

html[data-theme="dark"], body[data-theme="dark"], body.dark-mode, html.dark, html.dark-theme, body.dark-theme { --cc-text: #f7f8fa; --cc-muted: #a8b0bb; --cc-surface: #11161b; --cc-soft: #171d23; --cc-soft-2: #222931; --cc-border: #303842; --cc-border-strong: #3a4551; --cc-dark: #050708; --cc-dark-2: #20262c; --cc-shadow: 0 12px 32px rgba(0,0,0,.24); --heading-color: #f4f7fa; }

.cc-hero, .cc-shell, .case-converter-article, .cc-card, .cc-card *, .case-converter-article * { box-sizing: border-box; }

.cc-hero, .cc-shell { width: min(100% - 28px, 1320px); margin-inline: auto; }

.cc-hero h1 { position: relative; margin: 0px 0px 10px; padding: 0px 0px 13px; color: var(--cc-text); font-size: clamp(2.35rem, 4.6vw, 4.35rem); font-weight: 700; line-height: 1; letter-spacing: -0.032em; }

.cc-hero h1::after { content: ""; position: absolute; left: 50%; bottom: 0px; width: min(66%, 430px); height: 4px; transform: translateX(-50%); border-radius: 999px; background: currentcolor; opacity: 0.88; }

.cc-hero p { max-width: 790px; margin: 0px auto; color: var(--cc-muted); font: 500 clamp(1rem, 1.65vw, 1.22rem) / 1.45 "Times New Roman", Times, Georgia, serif; }

.cc-shell { display: grid; gap: 16px; padding: 0px; }

.cc-card { min-width: 0px; width: 100%; border: 1px solid var(--cc-border); border-radius: var(--cc-radius); background: linear-gradient(145deg,color-mix(in srgb,var(--cc-surface) 94%,transparent),var(--cc-soft)); box-shadow: var(--cc-shadow); }

.cc-intro-copy { position: relative; z-index: 1; min-width: 0px; }

.cc-intro-copy h2, .cc-panel-head h2 { margin: 0px; color: var(--cc-text); font-size: clamp(1.3rem, 2vw, 1.65rem); font-weight: 700; line-height: 1.15; }

.cc-intro-wave { position: absolute; right: -52px; bottom: -38px; width: 390px; height: 165px; pointer-events: none; opacity: 0.55; background: radial-gradient(120% 105% at 20% 10%, transparent 56%, rgba(203, 213, 225, 0.62) 57%, transparent 59%), radial-gradient(120% 105% at 36% 24%, transparent 60%, rgba(203, 213, 225, 0.55) 61%, transparent 63%), radial-gradient(120% 105% at 52% 38%, transparent 64%, rgba(203, 213, 225, 0.48) 65%, transparent 67%), radial-gradient(120% 105% at 68% 52%, transparent 68%, rgba(203, 213, 225, 0.42) 69%, transparent 71%); }

.cc-mode-panel, .cc-editor-panel, .cc-output-panel, .cc-support-grid > .cc-card { padding: 16px; }

.cc-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }

.cc-panel-head-stack { align-items: flex-start; flex-wrap: wrap; }

.cc-stats { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

.cc-pill, .cc-live-pill { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 34px; padding: 6px 12px; border: 1px solid var(--cc-border); border-radius: 999px; background: linear-gradient(180deg,var(--cc-surface),var(--cc-soft)); color: var(--cc-muted); font: 600 0.9rem / 1.1 "Times New Roman", Times, Georgia, serif; white-space: nowrap; }

.cc-section-note { color: var(--cc-muted); font: 600 0.92rem / 1.2 "Times New Roman", Times, Georgia, serif; }

.cc-mode, .cc-rule, .cc-secondary-btn, .cc-primary-subtle, .cc-primary-btn { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }

.cc-mode:hover, .cc-rule:hover, .cc-secondary-btn:hover, .cc-primary-subtle:hover { border-color: var(--cc-border-strong); box-shadow: rgba(15, 23, 42, 0.05) 0px 5px 14px; }

.cc-mode:active, .cc-rule:active, .cc-secondary-btn:active, .cc-primary-subtle:active, .cc-primary-btn:active { transform: translateY(1px) scale(0.992); }

.cc-mode.is-active { border-color: rgb(17, 24, 39); background: linear-gradient(135deg, rgb(6, 9, 13), rgb(24, 29, 34) 58%, rgb(43, 49, 56)); color: rgb(255, 255, 255); box-shadow: rgba(255, 255, 255, 0.06) 0px 0px 0px 1px inset, rgba(2, 6, 23, 0.14) 0px 8px 18px; }

.cc-workspace-grid, .cc-support-grid { display: grid; grid-template-columns: 1fr; gap: 16px; min-width: 0px; }

.cc-editor-panel, .cc-output-panel { min-width: 0px; }

.cc-textarea { display: block; width: 100%; max-width: 100%; min-width: 0px; min-height: 142px; padding: 14px 15px; resize: vertical; border: 1px solid var(--cc-border-strong); border-radius: 13px; outline: none; background: var(--cc-surface); color: var(--cc-text); font: 500 clamp(0.98rem, 1.45vw, 1.08rem) / 1.5 "Times New Roman", Times, Georgia, serif; transition: border-color 0.16s, box-shadow 0.16s, background 0.16s; }

.cc-textarea:focus { border-color: rgb(148, 163, 184); box-shadow: rgba(148, 163, 184, 0.13) 0px 0px 0px 3px; }

.cc-output { min-height: 188px; background: var(--cc-soft); }

.cc-mini-actions, .cc-triple-actions { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; margin-top: 10px; }

.cc-secondary-btn, .cc-primary-subtle { min-width: 0px; min-height: 50px; padding: 10px; border: 1px solid var(--cc-border); border-radius: 12px; background: linear-gradient(180deg,var(--cc-surface),var(--cc-soft)); color: var(--cc-text); display: flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; font: 700 0.96rem / 1.2 "Times New Roman", Times, Georgia, serif; transition: transform 0.16s, border-color 0.16s, box-shadow 0.16s, filter 0.16s; }

.cc-primary-subtle { border-color: rgb(17, 24, 39); background: linear-gradient(135deg, rgb(6, 9, 13), rgb(24, 29, 34) 58%, rgb(43, 49, 56)); color: rgb(255, 255, 255); }

.cc-rules-card { margin-top: 12px; padding: 12px; border: 1px solid var(--cc-border); border-radius: 14px; background: var(--cc-soft); }

.cc-rules-head { margin-bottom: 10px; color: var(--cc-text); font: 700 1rem / 1.3 "Times New Roman", Times, Georgia, serif; }

.cc-rules-head span { color: var(--cc-muted); font-weight: 500; font-size: 0.88rem; }

.cc-rules-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 8px; }

.cc-rule { min-width: 0px; min-height: 42px; padding: 7px 8px; border: 1px solid var(--cc-border); border-radius: 10px; background: var(--cc-surface); color: var(--cc-text); cursor: pointer; font: 700 0.92rem / 1 "Times New Roman", Times, Georgia, serif; transition: transform 0.16s, border-color 0.16s, box-shadow 0.16s, background 0.16s, color 0.16s; }

.cc-rule.is-active { border-color: rgb(17, 24, 39); background: linear-gradient(135deg, rgb(6, 9, 13), rgb(24, 29, 34) 58%, rgb(43, 49, 56)); color: rgb(255, 255, 255); }

.cc-primary-btn { width: 100%; min-height: 54px; margin-top: 12px; padding: 11px 18px; border: 0px; border-radius: 12px; background: linear-gradient(135deg, rgb(6, 9, 13), rgb(21, 26, 32) 58%, rgb(36, 42, 49)); color: rgb(255, 255, 255); display: flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer; box-shadow: rgba(2, 6, 23, 0.15) 0px 8px 18px, rgba(255, 255, 255, 0.06) 0px 0px 0px 1px inset; font: 700 1.12rem / 1 "Times New Roman", Times, Georgia, serif; transition: transform 0.16s, box-shadow 0.16s, filter 0.16s; }

.cc-primary-btn:hover { filter: brightness(1.04); box-shadow: rgba(2, 6, 23, 0.19) 0px 11px 22px, rgba(255, 255, 255, 0.06) 0px 0px 0px 1px inset; }

.cc-primary-icon, .cc-primary-arrow { font-size: 1.18em; }

.cc-primary-btn.is-loading .cc-primary-arrow { display: none; }

.cc-primary-btn.is-loading .cc-primary-icon { animation: 0.25s linear 0s infinite normal none running cc-spin; }

@keyframes cc-spin { 
  100% { transform: rotate(360deg); }
}

.cc-info-strip { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 0px; margin-top: 10px; padding: 9px 10px; border: 1px solid var(--cc-border); border-radius: 12px; background: var(--cc-surface); }

.cc-info-item { min-width: 0px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 4px 8px; text-align: center; color: var(--cc-muted); font: 600 0.87rem / 1.25 "Times New Roman", Times, Georgia, serif; }

.cc-info-item + .cc-info-item { border-left: 1px solid var(--cc-border); }

.cc-help-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; }

.cc-help-card, .cc-step-card { min-width: 0px; padding: 13px; border: 1px solid var(--cc-border); border-radius: 14px; background: var(--cc-surface); display: flex; align-items: flex-start; gap: 11px; transition: transform 0.16s, border-color 0.16s, box-shadow 0.16s; }

.cc-help-card:hover, .cc-step-card:hover { transform: translateY(-1px); border-color: var(--cc-border-strong); }

.cc-help-icon { width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center; border: 1px solid var(--cc-border); border-radius: 50%; background: var(--cc-soft); font-size: 1.18rem; }

.cc-help-card h3, .cc-step-card h3 { margin: 0px 0px 3px; color: var(--cc-text); font: 700 1rem / 1.22 "Times New Roman", Times, Georgia, serif; }

.cc-help-card p, .cc-step-card p { margin: 0px; color: var(--cc-muted); font: 500 0.9rem / 1.35 "Times New Roman", Times, Georgia, serif; }

.cc-steps-grid { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 8px; align-items: center; }

.cc-step-num { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 50%; background: rgb(11, 15, 18); color: rgb(255, 255, 255); font: 700 0.88rem / 1 "Times New Roman", Times, Georgia, serif; }

.cc-step-arrow { color: var(--cc-muted); font-size: 1.45rem; text-align: center; }

.tool-divider { width: min(100% - 28px, 1320px); height: 3.5px; margin: 42px auto; border: 0px; border-radius: 2px; background: var(--heading-color,#111827); opacity: 0.85; }

.case-converter-article h2, .case-converter-article h3 { padding-left: 12px; border-left: 3.5px solid currentcolor; color: var(--cc-text); }

.case-converter-article h2 { margin: 34px 0px 14px; font-size: clamp(1.65rem, 4vw, 2.35rem); line-height: 1.15; }

.case-converter-article h3 { margin: 26px 0px 10px; font-size: clamp(1.28rem, 3vw, 1.7rem); line-height: 1.2; }

.case-converter-article p, .case-converter-article li { color: var(--cc-muted); font: 500 1.05rem / 1.75 "Times New Roman", Times, Georgia, serif; }

.case-converter-article ul, .case-converter-article ol { padding-left: 1.4rem; }

.case-converter-article .steps li { padding: 15px 17px; border: 1px solid var(--cc-border); border-radius: 14px; background: var(--cc-surface); }

.case-converter-article .faq-item { border-bottom: 1px solid var(--cc-border); }

.case-converter-article .faq-item:first-of-type { border-top: 1px solid var(--cc-border); }

.case-converter-article summary::-webkit-details-marker { display: none; }

.case-converter-article summary::marker { content: ""; }

.case-converter-article .faq-item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 68px; padding: 16px 4px; cursor: pointer; }

.case-converter-article .faq-item summary span:first-child { color: var(--cc-text); font: 600 1.02rem / 1.35 "Times New Roman", Times, Georgia, serif; }

.case-converter-article .faq-chevron { flex: 0 0 auto; color: var(--cc-text); font-size: 1.25rem; transition: transform 0.18s; }

.case-converter-article .faq-item[open] .faq-chevron { transform: rotate(180deg); }

.case-converter-article .faq-answer { padding: 0px 28px 16px 4px; }

.case-converter-article .article-cta h3 { margin: 0px 0px 8px; padding: 0px; border: 0px; font-size: 1.28rem; }

.case-converter-article .article-cta p { margin: 0px 0px 10px; font-size: 0.98rem; line-height: 1.55; }

.case-converter-article .text-link { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding-bottom: 2px; border-bottom: 2px solid currentcolor; color: var(--cc-text); text-decoration: none; font: 700 1.05rem / 1.2 "Times New Roman", Times, Georgia, serif; }

.cc-flash { animation: 0.28s ease 0s 1 normal none running cc-flash; }

@keyframes cc-flash { 
  0% { transform: scale(0.995); }
  50% { transform: scale(1.006); }
  100% { transform: scale(1); }
}

@media (min-width: 980px) {
.cc-workspace-grid { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); align-items: stretch; }

.cc-workspace-grid > .cc-card { height: 100%; }

.cc-output-panel { display: flex; flex-direction: column; }

.cc-output-panel .cc-textarea { flex: 1 1 0%; min-height: 250px; }

.cc-support-grid { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); }
}

@media (max-width: 1100px) {
.cc-mode-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }

.cc-steps-grid { grid-template-columns: 1fr; gap: 8px; }

.cc-step-arrow { transform: rotate(90deg); }
}

@media (max-width: 640px) {
:root { --cc-mobile-gutter: 6px; --cc-mobile-inner: 6px; }

.cc-hero, .cc-shell { transform: translateX(-50%); width: calc(100vw - (var(--cc-mobile-gutter) * 2)) !important; max-width: calc(100vw - (var(--cc-mobile-gutter) * 2)) !important; margin-left: 50% !important; margin-right: 0px !important; }

.cc-hero { padding: 22px 0px 16px; }

.cc-hero h1 { margin: 0px 0px 10px; padding-bottom: 12px; font-size: clamp(1.72rem, 7.5vw, 2.15rem); line-height: 1.05; white-space: nowrap; }

.cc-hero h1::after { width: min(84%, 430px); }

.cc-hero p { max-width: 92%; font-size: 0.96rem; line-height: 1.4; }

.cc-shell { gap: 16px; }

.cc-card { border-radius: 18px; }

.cc-intro-card { min-height: 106px; padding: 14px 15px; gap: 14px; }

.cc-intro-icon { width: 58px; height: 58px; border-radius: 50%; font-size: 1.55rem; }

.cc-intro-copy h2 { font-size: 1.1rem; line-height: 1.18; }

.cc-intro-copy p { font-size: 0.9rem; line-height: 1.38; }

.cc-intro-wave { width: 220px; height: 105px; right: -58px; bottom: -30px; }

.cc-mode-panel, .cc-editor-panel, .cc-output-panel, .cc-support-grid > .cc-card { padding: var(--cc-mobile-inner); }

.cc-mode-panel > .cc-panel-head, .cc-editor-panel > .cc-panel-head, .cc-output-panel > .cc-panel-head, .cc-support-grid > .cc-card > .cc-panel-head { margin: 8px 8px 12px; }

.cc-mode-grid, .cc-editor-panel > .cc-textarea, .cc-editor-panel > .cc-mini-actions, .cc-editor-panel > .cc-rules-card, .cc-editor-panel > .cc-primary-btn, .cc-editor-panel > .cc-triple-actions, .cc-output-panel > .cc-textarea, .cc-output-panel > .cc-triple-actions, .cc-output-panel > .cc-info-strip, .cc-support-grid .cc-help-grid, .cc-support-grid .cc-steps-grid { width: calc(100% - (var(--cc-mobile-inner) * 2)); margin-left: auto; margin-right: auto; }

.cc-panel-head h2 { font-size: 1.06rem; }

.cc-pill, .cc-live-pill { min-height: 30px; padding: 5px 9px; font-size: 0.78rem; }

.cc-stats { gap: 5px; }

.cc-mode-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px; }

.cc-mode { min-height: 68px; padding: 8px 6px; border-radius: 12px; }

.cc-mode-icon { font-size: 1.22rem; }

.cc-mode-label { font-size: 0.79rem; }

.cc-textarea { min-height: 130px; padding: 13px; border-radius: 12px; font-size: 0.95rem; }

.cc-output { min-height: 154px; }

.cc-mini-actions, .cc-triple-actions { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 7px; margin-top: 9px; }

.cc-secondary-btn, .cc-primary-subtle { min-height: 46px; padding: 8px 5px; gap: 5px; border-radius: 11px; font-size: 0.8rem; }

.cc-rules-card { margin-top: 10px; padding: 10px; border-radius: 13px; }

.cc-rules-head { font-size: 0.9rem; }

.cc-rules-head span { font-size: 0.76rem; }

.cc-rules-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 7px; }

.cc-rule { min-height: 39px; font-size: 0.82rem; }

.cc-primary-btn { min-height: 50px; margin-top: 10px; border-radius: 11px; font-size: 1rem; }

.cc-info-strip { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 0px; padding: 7px 4px; }

.cc-info-item { padding: 4px 5px; gap: 4px; font-size: 0.7rem; line-height: 1.2; }

.cc-help-grid { grid-template-columns: 1fr; gap: 8px; }

.cc-help-card, .cc-step-card { padding: 11px; border-radius: 13px; }

.cc-help-icon { width: 40px; height: 40px; flex-basis: 40px; }

.cc-help-card h3, .cc-step-card h3 { font-size: 0.94rem; }

.cc-help-card p, .cc-step-card p { font-size: 0.82rem; }

.cc-step-arrow { font-size: 1.2rem; }

.cc-section-note { font-size: 0.76rem; }

.tool-divider { width: calc(-12px + 100vw); margin: 34px auto; }

.case-converter-article { width: calc(-20px + 100vw); max-width: calc(-20px + 100vw); margin-left: 50%; margin-right: 0px; transform: translateX(-50%); padding-bottom: 14px; }

.case-converter-article h2 { margin: 28px 0px 13px; font-size: 1.55rem; }

.case-converter-article h3 { margin: 22px 0px 9px; font-size: 1.23rem; }

.case-converter-article p, .case-converter-article li { font-size: 1rem; line-height: 1.7; }

.case-converter-article .steps li { padding: 13px 14px; }

.case-converter-article .faq-item summary { min-height: 62px; padding: 14px 4px; }

.case-converter-article .faq-item summary span:first-child { font-size: 1rem; }

.case-converter-article .article-cta { margin-top: 20px; padding: 15px 14px; border-radius: 16px; }
}

@media (max-width: 370px) {
.cc-hero h1 { font-size: 1.58rem; }

.cc-mini-actions, .cc-triple-actions { gap: 5px; }

.cc-secondary-btn, .cc-primary-subtle { font-size: 0.74rem; padding-left: 3px; padding-right: 3px; }

.cc-info-item { font-size: 0.64rem; }
}

@media (prefers-reduced-motion: reduce) {
.cc-mode, .cc-rule, .cc-secondary-btn, .cc-primary-subtle, .cc-primary-btn, .cc-help-card, .cc-step-card, .cc-faq-chevron { transition: none !important; }

.cc-flash, .cc-primary-btn.is-loading .cc-primary-icon { animation: auto ease 0s 1 normal none running none !important; }
}

.cc-mode.is-pressed, .cc-rule.is-pressed, .cc-secondary-btn.is-pressed, .cc-primary-subtle.is-pressed, .cc-primary-btn.is-pressed { filter: brightness(0.97); transform: translateY(1px) scale(0.992) !important; }

.cc-intro-card { position: relative; display: grid; grid-template-columns: auto minmax(0px, 1fr); align-items: center; overflow: hidden; min-height: 88px; padding: 12px 18px; gap: 14px; }

.cc-intro-icon { position: relative; z-index: 1; display: grid; place-items: center; flex: 0 0 auto; background: linear-gradient(145deg, rgb(75, 85, 99), rgb(6, 10, 15) 76%); color: rgb(255, 255, 255); box-shadow: rgba(255, 255, 255, 0.08) 0px 0px 0px 1px inset, rgba(2, 6, 23, 0.18) 0px 8px 20px; font: 700 1.7rem / 1 "Times New Roman", Times, Georgia, serif; width: 58px; height: 58px; border-radius: 13px; }

.cc-intro-copy h2 { font-size: 1.35rem; }

.cc-intro-copy p { margin: 5px 0px 0px; color: var(--cc-muted); font: 500 1rem / 1.35 "Times New Roman", Times, Georgia, serif; }

.cc-mode-panel { padding: 12px 14px; }

.cc-mode-grid { display: grid; grid-template-columns: repeat(6, minmax(0px, 1fr)); gap: 7px; }

.cc-mode { min-width: 0px; border: 1px solid var(--cc-border); background: linear-gradient(180deg,var(--cc-surface),var(--cc-soft)); color: var(--cc-text); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.16s, border-color 0.16s, box-shadow 0.16s, background 0.16s, color 0.16s; min-height: 62px; padding: 7px 5px; border-radius: 10px; gap: 3px; }

.cc-mode-icon { font: 700 1.18rem / 1 "Times New Roman", Times, Georgia, serif; }

.cc-mode-label { font: 700 0.74rem / 1.08 "Times New Roman", Times, Georgia, serif; text-align: center; white-space: nowrap; }

@media (max-width: 1100px) {
.cc-mode-grid { grid-template-columns: repeat(6, minmax(0px, 1fr)); }
}

@media (max-width: 640px) {
:root { --cc-mobile-gutter: 6px; --cc-mobile-inner: 8px; }

.cc-hero { padding: 16px 0px 10px; }

.cc-hero h1 { margin: 0px 0px 6px; padding-bottom: 9px; font-size: clamp(1.85rem, 8.2vw, 2.2rem); line-height: 1; }

.cc-hero h1::after { width: min(76%, 340px); height: 3px; }

.cc-hero p { max-width: 94%; font-size: 0.9rem; line-height: 1.35; }

.cc-shell { gap: 10px; }

.cc-card { border-radius: 13px; }

.cc-intro-card { min-height: 82px; grid-template-columns: 48px minmax(0px, 1fr); gap: 11px; padding: 10px 12px; }

.cc-intro-icon { width: 48px; height: 48px; border-radius: 9px; font-size: 1.38rem; }

.cc-intro-copy h2 { font-size: 1rem; line-height: 1.1; }

.cc-intro-copy p { margin-top: 3px; font-size: 0.76rem; line-height: 1.28; }

.cc-intro-wave { width: 160px; height: 80px; right: -45px; bottom: -24px; opacity: 0.4; }

.cc-mode-panel, .cc-editor-panel, .cc-output-panel, .cc-support-grid > .cc-card { padding: 9px 10px; }

.cc-mode-panel > .cc-panel-head, .cc-editor-panel > .cc-panel-head, .cc-output-panel > .cc-panel-head, .cc-support-grid > .cc-card > .cc-panel-head { width: 100%; margin: 0px 0px 8px; }

.cc-panel-head { gap: 6px; flex-wrap: nowrap; align-items: center; }

.cc-panel-head-stack { flex-wrap: nowrap; align-items: center; }

.cc-panel-head h2 { font-size: 0.96rem; line-height: 1.1; white-space: nowrap; }

.cc-pill, .cc-live-pill { min-height: 24px; padding: 3px 7px; font-size: 0.62rem; }

.cc-section-note { font-size: 0.64rem; white-space: nowrap; }

.cc-stats { gap: 3px; flex-wrap: nowrap; margin-left: auto; }

.cc-mode-grid { width: 100%; margin: 0px; grid-template-columns: repeat(6, minmax(0px, 1fr)); gap: 4px; }

.cc-mode { min-height: 56px; padding: 5px 2px; border-radius: 8px; gap: 3px; }

.cc-mode-icon { font-size: 0.95rem; line-height: 1; }

.cc-mode-label { font-size: 0.55rem; line-height: 1.05; white-space: nowrap; letter-spacing: -0.01em; }

.cc-editor-panel > .cc-textarea, .cc-editor-panel > .cc-mini-actions, .cc-editor-panel > .cc-rules-card, .cc-editor-panel > .cc-primary-btn, .cc-editor-panel > .cc-triple-actions, .cc-output-panel > .cc-textarea, .cc-output-panel > .cc-triple-actions, .cc-output-panel > .cc-info-strip, .cc-support-grid .cc-help-grid, .cc-support-grid .cc-steps-grid { width: 100%; margin-left: 0px; margin-right: 0px; }

.cc-textarea { min-height: 102px; padding: 9px 10px; border-radius: 9px; font-size: 0.78rem; line-height: 1.35; }

.cc-output { min-height: 100px; }

.cc-mini-actions, .cc-triple-actions { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 5px; margin-top: 7px; }

.cc-secondary-btn, .cc-primary-subtle { min-height: 36px; padding: 5px 3px; gap: 4px; border-radius: 8px; font-size: 0.64rem; line-height: 1.05; }

.cc-rules-card { margin-top: 8px; padding: 7px 8px; border-radius: 9px; }

.cc-rules-head { margin-bottom: 6px; font-size: 0.72rem; line-height: 1.15; }

.cc-rules-head span { font-size: 0.58rem; }

.cc-rules-grid { grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 4px; }

.cc-rule { min-height: 30px; padding: 3px 2px; border-radius: 7px; font-size: 0.62rem; }

.cc-primary-btn { min-height: 39px; margin-top: 8px; padding: 7px 10px; border-radius: 8px; font-size: 0.78rem; gap: 7px; }

.cc-primary-icon, .cc-primary-arrow { font-size: 1em; }

.cc-info-strip { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 0px; margin-top: 7px; padding: 5px 3px; border-radius: 8px; }

.cc-info-item { padding: 2px 3px; gap: 3px; font-size: 0.52rem; line-height: 1.12; white-space: nowrap; }

.cc-help-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 5px; }

.cc-help-card { padding: 7px 5px; border-radius: 9px; gap: 6px; align-items: center; }

.cc-help-icon { width: 30px; height: 30px; flex-basis: 30px; font-size: 0.82rem; }

.cc-help-card h3 { font-size: 0.63rem; line-height: 1.08; margin-bottom: 2px; }

.cc-help-card p { font-size: 0.53rem; line-height: 1.2; }

.cc-steps-grid { grid-template-columns: 1fr auto 1fr auto 1fr; gap: 3px; align-items: center; }

.cc-step-card { padding: 7px 5px; border-radius: 9px; gap: 5px; align-items: center; }

.cc-step-num { width: 25px; height: 25px; flex-basis: 25px; font-size: 0.6rem; }

.cc-step-card h3 { font-size: 0.61rem; line-height: 1.08; margin-bottom: 2px; }

.cc-step-card p { font-size: 0.51rem; line-height: 1.18; }

.cc-step-arrow { transform: none; font-size: 0.85rem; }

.tool-divider { margin: 24px auto 28px; }
}

@media (max-width: 370px) {
.cc-mode-grid { gap: 3px; }

.cc-mode { min-height: 52px; padding-left: 1px; padding-right: 1px; }

.cc-mode-icon { font-size: 0.86rem; }

.cc-mode-label { font-size: 0.49rem; }

.cc-panel-head h2 { font-size: 0.9rem; }

.cc-pill, .cc-live-pill { font-size: 0.56rem; padding-left: 5px; padding-right: 5px; }
}

html, body { max-width: 100%; overflow-x: hidden; }

#main { width: 100%; max-width: 100%; overflow-x: clip; }

.cc-hero { padding: 22px 0px 10px; text-align: center; }

.cc-intro-copy .cc-intro-lead { margin: 4px 0px 0px; color: var(--cc-muted); font: 600 0.95rem / 1.3 "Times New Roman", Times, Georgia, serif; }

.cc-intro-copy .cc-intro-note { margin: 3px 0px 0px; color: var(--cc-muted); font: 500 0.86rem / 1.3 "Times New Roman", Times, Georgia, serif; opacity: 0.95; }

.case-converter-article .steps { counter-reset: cc-article-step 0; display: grid; gap: 12px; margin: 0px; padding: 0px; list-style: none; }

.case-converter-article .steps > li { counter-increment: cc-article-step 1; position: relative; display: flex; align-items: center; min-height: 78px; margin: 0px; overflow: hidden; border: 1px solid var(--cc-border); border-radius: 14px; background: var(--cc-surface); color: var(--cc-muted); padding: 16px 18px 16px 76px !important; }

.case-converter-article .steps > li::before { font: 700 0.85rem / 1 "Times New Roman", Times, Georgia, serif; content: counter(cc-article-step, decimal-leading-zero) !important; position: absolute !important; inset: 50% auto auto 18px !important; width: 40px !important; height: 40px !important; margin: 0px !important; padding: 0px !important; transform: translateY(-50%) !important; display: grid !important; place-items: center !important; border: 1.5px solid var(--cc-text) !important; border-radius: 999px !important; background: var(--cc-surface) !important; color: var(--cc-muted) !important; box-shadow: none !important; }

.case-converter-article .steps > li::after { content: none !important; display: none !important; }

@media (max-width: 640px) {
.cc-hero, .cc-shell { width: calc(100% - 12px) !important; max-width: calc(100% - 12px) !important; margin-left: auto !important; margin-right: auto !important; transform: none !important; }

.case-converter-article { width: calc(100% - 20px) !important; max-width: calc(100% - 20px) !important; margin-left: auto !important; margin-right: auto !important; transform: none !important; }

.tool-divider { width: calc(100% - 12px) !important; }

.cc-hero { padding-top: 14px; padding-bottom: 9px; }

.cc-intro-card { min-height: 96px; align-items: center; }

.cc-intro-copy .cc-intro-lead { margin-top: 3px; font-size: 0.72rem; line-height: 1.24; }

.cc-intro-copy .cc-intro-note { margin-top: 2px; font-size: 0.66rem; line-height: 1.22; }

.case-converter-article .steps > li { min-height: 82px; font-size: 0.95rem; line-height: 1.55; padding: 14px 14px 14px 66px !important; }

.case-converter-article .steps > li::before { left: 14px !important; width: 38px !important; height: 38px !important; font-size: 0.78rem !important; }
}

@media (max-width: 640px) {
.cc-editor-panel > .cc-panel-head.cc-panel-head-stack { display: grid; grid-template-columns: 1fr; gap: 8px; align-items: start; }

.cc-editor-panel > .cc-panel-head.cc-panel-head-stack > h2 { width: 100%; white-space: normal; }

.cc-editor-panel .cc-stats { width: 100%; margin: 0px; display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 6px; }

.cc-editor-panel .cc-stats .cc-pill { width: 100%; min-width: 0px; min-height: 36px; padding: 7px 5px; border-radius: 999px; font-size: 0.72rem; line-height: 1.1; font-weight: 700; justify-content: center; text-align: center; }

.cc-output-panel .cc-info-strip { grid-template-columns: repeat(3, minmax(0px, 1fr)); padding: 6px 3px; }

.cc-output-panel .cc-info-item { min-height: 30px; padding: 4px 3px; gap: 3px; font-size: 0.62rem; line-height: 1.08; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

@media (max-width: 370px) {
.cc-editor-panel .cc-stats { gap: 4px; }

.cc-editor-panel .cc-stats .cc-pill { min-height: 34px; padding: 6px 3px; font-size: 0.66rem; }

.cc-output-panel .cc-info-item { font-size: 0.57rem; }
}

.case-converter-article .cc-article-steps { counter-reset: cc-article-step 0 !important; display: grid !important; grid-template-columns: minmax(0px, 1fr) !important; gap: 12px !important; width: 100% !important; margin: 0px !important; padding: 0px !important; list-style: none !important; }

.case-converter-article .cc-article-steps > li { counter-increment: cc-article-step 1; position: relative !important; display: grid !important; grid-template-columns: 44px minmax(0px, 1fr) !important; column-gap: 14px !important; align-items: center !important; width: 100% !important; min-width: 0px !important; min-height: 76px !important; margin: 0px !important; padding: 14px 16px !important; overflow: visible !important; border: 1px solid var(--cc-border) !important; border-radius: 16px !important; background: var(--cc-surface) !important; color: var(--cc-muted) !important; text-align: left !important; white-space: normal !important; }

.case-converter-article .cc-article-steps > li::before { font: 700 0.82rem / 1 "Times New Roman", Times, Georgia, serif; content: counter(cc-article-step, decimal-leading-zero) !important; position: static !important; inset: auto !important; grid-area: 1 / 1 !important; width: 42px !important; height: 42px !important; min-width: 42px !important; margin: 0px !important; padding: 0px !important; transform: none !important; display: grid !important; place-items: center !important; border: 1.5px solid var(--cc-text) !important; border-radius: 999px !important; background: var(--cc-surface) !important; color: var(--cc-muted) !important; box-shadow: none !important; }

.case-converter-article .cc-article-steps > li::after { content: none !important; display: none !important; }

.case-converter-article .cc-step-copy { font: 500 1.02rem / 1.55 "Times New Roman", Times, Georgia, serif; grid-area: 1 / 2 !important; display: block !important; min-width: 0px !important; width: auto !important; margin: 0px !important; padding: 0px !important; float: none !important; position: static !important; transform: none !important; color: var(--cc-muted) !important; text-align: left !important; white-space: normal !important; word-break: normal !important; overflow-wrap: break-word !important; letter-spacing: normal !important; }

.case-converter-article .cc-step-copy strong { display: inline !important; width: auto !important; margin: 0px !important; padding: 0px !important; float: none !important; position: static !important; transform: none !important; color: var(--cc-text) !important; white-space: normal !important; }

@media (max-width: 640px) {
.case-converter-article .cc-article-steps { gap: 10px !important; }

.case-converter-article .cc-article-steps > li { grid-template-columns: 40px minmax(0px, 1fr) !important; column-gap: 12px !important; min-height: 74px !important; padding: 13px 14px !important; border-radius: 15px !important; }

.case-converter-article .cc-article-steps > li::before { width: 38px !important; height: 38px !important; min-width: 38px !important; font-size: 0.76rem !important; }

.case-converter-article .cc-step-copy { font-size: 0.96rem !important; line-height: 1.48 !important; }
}

.case-converter-article { width: min(100% - 40px, 1180px); margin-inline: auto; padding: 0px; color: var(--cc-text); }

.case-converter-article .article-cta { max-width: 620px; margin: 20px auto 0px; padding: 10px 12px 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid var(--cc-border); border-radius: 14px; background: var(--cc-surface); text-align: left; box-shadow: none; }

.case-converter-article .article-cta-copy { min-width: 0px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }

.case-converter-article .article-cta-copy strong { color: var(--cc-text); font: 700 0.98rem / 1.2 "Times New Roman", Times, Georgia, serif; }

.case-converter-article .article-cta-copy span { color: var(--cc-muted); font: 500 0.84rem / 1.35 "Times New Roman", Times, Georgia, serif; }

.case-converter-article .article-cta-arrow { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border: 1px solid var(--cc-border-strong); border-radius: 11px; background: linear-gradient(135deg, rgb(6, 9, 13), rgb(24, 29, 34) 58%, rgb(43, 49, 56)); color: rgb(255, 255, 255); text-decoration: none; font: 700 1.18rem / 1 "Times New Roman", Times, Georgia, serif; transition: transform 0.16s, filter 0.16s, box-shadow 0.16s; }

.case-converter-article .article-cta-arrow:hover { filter: brightness(1.06); box-shadow: rgba(2, 6, 23, 0.12) 0px 6px 14px; }

.case-converter-article .article-cta-arrow:active { transform: translateY(1px) scale(0.97); }

@media (max-width: 640px) {
.cc-intro-copy .cc-intro-lead { font-size: 0.7rem; line-height: 1.22; }

.cc-intro-copy .cc-intro-note { font-size: 0.64rem; line-height: 1.2; }

.case-converter-article .article-cta { width: calc(100% - 4px); margin-top: 18px; padding: 9px 10px 9px 12px; gap: 10px; border-radius: 12px; }

.case-converter-article .article-cta-copy { display: block; }

.case-converter-article .article-cta-copy strong { display: block; margin-bottom: 2px; font-size: 0.9rem; }

.case-converter-article .article-cta-copy span { display: block; font-size: 0.76rem; line-height: 1.28; }

.case-converter-article .article-cta-arrow { width: 36px; height: 36px; flex-basis: 36px; border-radius: 10px; }
}

@media (prefers-reduced-motion: reduce) {
.case-converter-article .article-cta-arrow { transition: none !important; }
}


