.ik-word-counter { --wc-navy: var(--ik-color-brand,#242f5d); --wc-muted:#64748b; color:#334155; font:inherit; line-height:1.65; }
.ik-word-counter *, .ik-word-counter *::before { box-sizing:border-box; }
.ik-wc-shell { width:min(100% - 40px,960px); margin-inline:auto; }
.ik-wc-hero { padding:128px 0 64px; text-align:center; background:radial-gradient(circle at 12% 10%,rgb(40 197 219 / 10%),transparent 30%),linear-gradient(180deg,#f8faff,#edf5fa); }
.ik-wc-breadcrumbs { display:flex; justify-content:center; flex-wrap:wrap; gap:9px; margin-bottom:25px; color:var(--wc-muted); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.ik-wc-breadcrumbs a { color:inherit; text-decoration:none; }
.ik-wc-eyebrow { display:inline-flex; padding:6px 13px; border:1px solid #e2e8f0; border-radius:999px; background:white; color:var(--wc-navy); font-size:11px; font-weight:800; letter-spacing:.13em; line-height:1.4; text-transform:uppercase; }
.ik-wc-hero h1 { margin:20px 0 0; color:var(--wc-navy); font-size:clamp(36px,5vw,64px); font-weight:800; letter-spacing:-.04em; line-height:1.1; }
.ik-wc-hero .ik-wc-intro { max-width:790px; margin:22px auto 0; color:#52627a; font-size:18px; font-weight:400; line-height:1.75; }
.ik-wc-main { padding:66px 0 80px; background:#f8fafe; }
.ik-wc-how { max-width:830px; margin:0 auto 42px; }
.ik-wc-how h2 { margin:16px 0 20px; color:var(--wc-navy); font-size:clamp(27px,4vw,36px); font-weight:800; line-height:1.2; }
.ik-wc-how ol { margin:0; padding:0; list-style:none; counter-reset:wc-step; display:grid; gap:12px; }
.ik-wc-how li { counter-increment:wc-step; display:flex; align-items:flex-start; gap:15px; padding:15px 18px; border:1px solid #e4eaf1; border-radius:16px; background:white; }
.ik-wc-how li::before { content:counter(wc-step,decimal-leading-zero); flex:0 0 auto; color:var(--wc-navy); font-size:13px; font-weight:800; }
.ik-wc-panel { padding:28px; border:1px solid #dfe7f1; border-radius:24px; background:white; box-shadow:0 24px 60px rgb(36 47 93 / 9%); }
.ik-wc-limits { display:flex; flex-wrap:wrap; gap:16px; margin-bottom:24px; }
.ik-wc-limits label { flex:1 1 180px; font-size:13px; font-weight:700; color:var(--wc-navy); }
.ik-wc-limits .ik-wc-task-label { flex-basis:100%; min-width:0; }
.ik-wc-limits input,.ik-wc-limits select { display:block; width:100%; min-height:46px; margin-top:7px; padding:10px 12px; border:1px solid #cbd5e1; border-radius:10px; background:white; color:#334155; font:inherit; font-size:16px; font-weight:400; }
.ik-wc-text-label { display:block; margin-bottom:8px; color:var(--wc-navy); font-weight:800; }
.ik-wc-panel textarea { display:block; width:100%; min-height:280px; padding:18px; resize:vertical; border:1px solid #cbd5e1; border-radius:12px; font:inherit; font-size:16px; line-height:1.7; color:#334155; background:#fcfdff; }
.ik-wc-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:20px; }
.ik-wc-stats > div { padding:15px; border-radius:12px; background:#f0f5f9; font-size:13px; font-weight:700; color:var(--wc-navy); }
.ik-wc-stats output { display:block; margin-top:4px; font-size:30px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1.3; overflow-wrap:anywhere; }
.ik-wc-stats .ik-wc-primary { background:var(--wc-navy); color:white; }
.ik-wc-status { margin:16px 0 10px; min-height:26px; font-size:14px; }
.ik-wc-status[data-state="ok"] { color:#087a45; }
.ik-wc-status[data-state="above"],.ik-wc-status[data-state="invalid"] { color:#b42318; }
.ik-wc-panel progress { display:block; width:100%; height:12px; accent-color:#242f5d; }
.ik-wc-panel [hidden] { display:none; }
.ik-wc-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:20px; }
.ik-wc-footer p { margin:0; color:var(--wc-muted); font-size:12px; max-width:640px; }
.ik-wc-footer button { padding:11px 22px; min-height:46px; border:1px solid #cbd5e1; border-radius:12px; background:white; color:var(--wc-navy); font:inherit; font-weight:800; cursor:pointer; }
.ik-wc-footer button:hover { background:#f0f5f9; }
.ik-word-counter :is(input,textarea,select,button,a):focus-visible { outline:3px solid #9ec4f2; outline-offset:3px; }
.ik-wc-cta { display:flex; align-items:center; gap:30px; justify-content:space-between; margin-top:52px; padding:32px; border-radius:24px; background:var(--wc-navy); color:white; }
.ik-wc-cta .ik-wc-eyebrow { border-color:rgb(255 255 255 / 25%); background:rgb(255 255 255 / 10%); color:white; }
.ik-wc-cta p { margin:15px 0 0; font-size:16px; }
.ik-wc-cta a { flex:0 0 auto; padding:13px 19px; border-radius:12px; background:var(--ik-color-action,#f5686d); color:white; font-size:14px; font-weight:800; text-decoration:none; text-align:center; }
@media(max-width:700px) { .ik-wc-hero { padding:104px 0 44px; } .ik-wc-hero .ik-wc-intro { font-size:16px; } .ik-wc-main { padding:44px 0 60px; } .ik-wc-cta { flex-direction:column; align-items:flex-start; padding:25px; } }
@media(max-width:480px) { .ik-wc-shell { width:calc(100% - 28px); } .ik-wc-panel { padding:16px; } .ik-wc-stats { gap:6px; } .ik-wc-stats > div { padding:10px 7px; font-size:11px; } .ik-wc-stats output { font-size:26px; } .ik-wc-footer { flex-direction:column; align-items:stretch; } }