.word-counter-page { min-height: calc(100svh - 176px); padding: 72px 24px 148px; }
.counter-container { width: min(800px, 100%); margin: 0 auto; }
.back-link { display: inline-flex; gap: 12px; align-items: center; font-size: 12px; color: #808185; margin-bottom: 58px; transition: color 150ms ease; }
.back-link:hover { color: var(--ink); }
.back-link span:first-child { font-size: 20px; font-weight: 300; line-height: .8; }
.counter-title { font-size: clamp(36px, 5vw, 58px); font-weight: 350; letter-spacing: -.065em; line-height: 1.15; margin: 0 0 49px; padding: 0; }
.editor-container { background: #fff; border: 1px solid #e7e7e7; border-radius: 13px; overflow: hidden; transition: border-color .15s ease; }
.editor-container:focus-within { border-color: #aeb0b4; }
.counter-editor { display: block; min-height: 310px; width: 100%; padding: 27px 28px; border: 0; outline: 0; resize: vertical; font: 400 16px/1.9 -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', 'Hiragino Kaku Gothic ProN', sans-serif; background: transparent; color: var(--ink); }
.counter-editor::placeholder { color: #a5a5a8; }
.editor-actions { padding: 14px 22px; border-top: 1px solid #f0f0ef; display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.editor-privacy { font-size: 11px; color: #acadb0; }
.button-group { display: flex; gap: 16px; }
.action-button { appearance: none; background: none; border: 0; padding: 6px 0; color: #4f5054; font-size: 12px; transition: opacity .15s ease; }
.action-button:hover { color: #0c0d0e; }
.action-button:disabled { color: #c7c8ca; cursor: default; }
.counter-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 48px; }
.stat { display: flex; flex-direction: column; align-items: flex-start; padding: 8px 15px 5px 26px; border-left: 1px solid #e9e9e8; gap: 13px; }
.stat:first-child { padding-left: 0; border-left: 0; }
.stat output { font-weight: 350; font-size: clamp(32px, 4vw, 48px); line-height: 1.05; letter-spacing: -.065em; color: #141516; font-variant-numeric: tabular-nums; }
.stat span { font-size: 12px; color: #8c8d91; }
@media (max-width: 620px) {
  .word-counter-page { min-height: calc(100svh - 136px); padding: 45px 20px 80px; }
  .back-link { margin-bottom: 42px; }
  .counter-title { margin-bottom: 30px; }
  .counter-editor { min-height: 280px; padding: 18px 18px; font-size: 15px; }
  .editor-actions { padding: 12px 16px; }
  .editor-privacy { font-size: 10px; max-width: 50%; }
  .counter-stats { margin-top: 32px; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
  .stat { padding-left: 20px; }
  .stat:nth-child(3) { border-left: 0; padding-left: 0; }
}
@media (prefers-reduced-motion: reduce) { .back-link, .action-button { transition: none; } }