Round palette color swatches

Round icon buttons

Round timeline markers and nav list stack ...

Timeline markers take the small radius; list-nav clips its
flush item stack with the panel radius, which also rounds the
navigation drawer menu.

Round nav drawer title chip

Round navigation shell controls and preview frame ...

The topbar current-page chip and drawer close button take the
small radius; the shell preview frame takes the panel radius.
Flush shell chrome (topbar, sidebar, footer) stays square.

Round tables and remaining bordered panels ...

Tables switch to border-collapse: separate with corner cells
rounded so cell backgrounds clip cleanly. Accordion, disclosure,
description list, activity log, page header, usage meter,
progress tracks and stages, quote, kbd, steps and drawer preview
now use the shared radius tokens. Vertical steps stay flush.

Extend light border radius to remaining components ...

Badges, alerts, toolbar, pagination, empty state, skeleton,
advanced select popup, step markers, code blocks, timeline
cards and definition lists now use the shared radius tokens.
Tables stay square (border-collapse suppresses radius), the
drawer stays flush to the screen edge.

Add light border radius across components ...

- New tokens: $border-radius-sm (3px controls), $border-radius-md
  (6px panels), $border-radius-pill (switch track)
- Apply via hard_panel and per-component: buttons, inputs, tabs,
  range thumb, checkbox, switch, chips, avatars, dropdown/popover/
  tooltip panels, modal, toast, file upload, input group, code examples
- Drawer stays sharp (flush to screen edge)

Quieten card, modal, drawer and toast accents ...

- Mute frames: base card, modal panel, drawer and default toast
  borders go from full-brightness to border-color-muted
- Replace inverted title bars (card, modal, drawer) with plain
  uppercase typography
- state_panel: state color now reads on the border and title text
  instead of a solid title bar

Remove hover scan animation from page header

Reduce control and typography density across the kit

Split _forms.scss by component ...

- _forms.scss (254): form-group, inputs, selects, form-grid, fieldset
- _file-upload.scss (280): file upload panel + its responsive rules
- _range.scss (46): range slider
- _choice-controls.scss (220): radio, radio-group, switch, checkbox
kit.scss imports them in the original cascade order; screenshots and
demo-sync (27 sections, 0 diffs) confirm no visual change.

Fix v0.4.0 review findings and demo asset paths ...

- Restore visible hover feedback on radio/checkbox (background $color-grey)
- Drop dead checked/hover border-color rules; guard checked with :not(:disabled)
- Tokenize radio border as $border-width-choice and add $range-thumb-size
  so the choice-size bump no longer widens range slider thumbs
- Add cursor: pointer to switch wrapper
- Revert escaped doc snippets to absolute URLs (relative sweep was
  teaching fake ./routes in documentation samples)
- Add compare-heights.js demo sync check with CHROME_PATH fallback;
  ignore screenshots/

v0.4.0 — GnRepeater, redesigned checkbox/radio ...

- Add GnRepeater Vue component for dynamic field groups
- Redesign checkbox and radio styles to match kit aesthetic:
  hard-panel background, accent borders, checkmark/dot indicators,
  hover → primary border, checked → subtle tint + colored mark
- Bump version to 0.4.0

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Add GnRepeater component for dynamic field groups ...

- New Vue adapter: GnRepeater with v-model, scoped #item slot,
  minItems/maxItems guards, and built-in Add/Remove UI
- SCSS: .repeater, .repeater-header, .repeater-item,
  .repeater-item-body, .repeater-item-actions
- Demo: vanilla repeater with inline JS + GnRepeater in Vue forms
- Build verified: compare-heights reports 0 differences

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Add GnTagInput component for multi-value string input ...

Features:
- New GnTagInput Vue component with inline chip display
- Enter / paste (with separator split) to add tags
- Backspace in empty field removes last tag
- Unique check and maxItems limit
- Removable chips with x button

Style:
- Add _tag-input.scss with .tag-input, .tag-input-wrap, .tag-input-field
- Chips reuse existing .chip-secondary styling

Demo:
- Add interactive tag input example to Forms section (vanilla + Vue)
- Add code example blocks for HTML and Vue usage

Docs:
- Add GnTagInput to CLAUDE.md component catalog

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Redesign toast UX: compact layout, progress bar, title-only mode ...

- Replace heavy colored header strip with inline icon+title header
- Add thin bottom progress bar showing remaining lifetime
- Support title-only compact single-line toasts (no text = no body padding)
- Increase tinted background opacity from 0.06 to 0.18 for visibility
- Fix vanilla toast defaults: all variants now use lifetime=4000, alone=true
- Add demo buttons for title-only variants in both vanilla and Vue demos
- Remove hover effect from toast close button
- Adjust close button position (top: 5px) and progress bar margin (1px)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

v0.3.0 — GnUserCard, NavigationShell footer slot, Vue demo partials ...

Features:
- Add GnUserCard Vue component with compact and full variants
- Add GnNavigationShell #footer slot for custom footer content
- Add profile footer demo in navigation-shell section
- Split demo/vue.html into 27 partials under demo/partials/vue/
- Fix toast open animation (nextTick + requestAnimationFrame pattern)

Style:
- Add .user-card and .user-card-compact to _cards.scss
- Add .profile-identity to _navigation-shell.scss

Docs:
- Add demo synchronization rules to CLAUDE.md

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Fix Vue demo visual issues and expand component showcase ...

- _forms.scss: rename .checkbox to .switch, create proper .checkbox
  for checkbox (square) vs switch (slider) differentiation
- GnSwitch.js: create dedicated switch component using .switch class
- _forms.scss: add .radio-group with flex-wrap gap for radio layouts
- GnRadioGroup.js: add radio-group class to container
- _cards.scss: fix .card-horizontal .card-media sizing with
  max-height, aspect-ratio, and align-self: start
- demo/vue.html: fix steps data (label → title)
- demo/vue.html: fix definition list data (definition → description)
- demo/vue.html: add Accordion, InputGroup demos
- demo/vue.html: add NavigationShell import (component registered)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Fix Vue demo: dark theme, label color, expanded component showcase ...

- demo/vue.html: replace broken CSS custom properties with real kit colors
  (body background #16161E, text #C0CAF5)
- demo/vue.html: update Vue CDN to 3.5.13
- demo/vue.html: expand demo to show 30+ components including
  Drawer, ConfirmDialog, Navigation, Progress, Timeline, Data Display,
  Identity, Chips, Toolbar, Overlays, EmptyState, Skeleton, Toasts
- _forms.scss: add color: $color-text-light to .label so labels are
  readable on dark backgrounds
- Add toast interaction demo buttons

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Disable BrowserSync ghostMode and fix login-card sizing ...

- gulpfile.js: add ghostMode: false to stop scroll sync across tabs
- _cards.scss: .card.login-card max-width 460px → max-width: 100%; width: 460px

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Style login card: 460px max-width, max-content submit, centered form-group ...

- .card.login-card max-width 360px -> 460px
- .login-card-submit width 100% -> max-content
- Fix .form-group indentation inside .login-card
- Demo login button: btn-secondary with-icon ph-sign-in

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Add GnLoginCard component for standardized login forms ...

- Create GnLoginCard Vue adapter component with username/password
  fields, optional remember-me checkbox, submit button, and
  forgot-password / sign-up links.
- Add `.login-card` styles in _cards.scss with centered header,
  full-width submit button, and spaced link row.
- Register GnLoginCard in plugin and index exports.
- Add login-card demo block to demo/partials/cards.html.
- Update CLAUDE.md, README, and Vue docs with component entry.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Add disabled styles for .btn-icon ...

Disabled `.btn-icon` now matches `.btn[disabled]` appearance:
muted text color, transparent background/border, not-allowed cursor,
0.72 opacity, and suppressed hover state.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Add compact .btn-icon-sm and fix copy-button demo ...

- Introduce `.btn-icon-sm` (28×28, 18 px icon) in `_buttons.scss` for
  a miniature icon-button variant.
- Remove `.btn-secondary` from demo copy buttons so they render as
  transparent icon-only controls without background.
- Add `size` prop to `GnIconButton` and `GnCopyButton` Vue components.
- Update docs and demo to reflect the new size option.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Remove hover animations from all card variants ...

- Remove transform transitions and hover_touch blocks from:
  .card, .status-card, .metric-card, .card-horizontal, .action-card
- Keep structural hover styles (border-color, background, box-shadow)
  only on the base .card selector
- Clean up transition-property declarations containing transform

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Add GnHorizontalCard component ...

- New SCSS block .card-horizontal with 1:4 flex layout
  .card-media (20% width, min 80px, max 160px)
  .card-body with .card-title, .card-content, .card-footer
- Title supports optional link via titleHref prop
- Image is optional; card works without it
- Registered in plugin.js and index.js exports
- Updated docs: README, CLAUDE.md, component-api, component-map, ai-usage-guide

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Improve Vue adapter usability, add router support, and fix animations ...

- Remove hover rotation from .btn-icon (SCSS)
- Fix iconNode to auto-prefix missing "ph-" and warn in dev
- Add CLAUDE.md as AI agent quick-reference for component usage
- Include src/vue/ and CLAUDE.md in published package files
- Add exports field wildcard for src/vue/* subpaths
- Reposition Vue adapter docs as primary contract (not thin wrapper)
- Add JSDoc @typedef to key Vue components (GnButton, GnInput, etc.)
- Add Vue demo page (demo/vue.html) linked from main navigation

Router support (optional, no hard dependency):
- Create useVueRouter composable with safe getCurrentInstance access
- Create GnRouterTabs component for route-driven tabs
- Add item.to support to GnNavList with auto-active and router.push
- Forward activeMatch through GnNavigationShell to GnNavList
- Register GnRouterTabs in plugin and index exports
- Update docs (README, CLAUDE, component-api, ai-usage-guide, component-map)

Fix missing close animations in Vue components:
- GnModal: a-hide transition before unmount (300ms)
- GnDrawer: a-hide transition before unmount (300ms)
- GnToastProvider: dismiss with a-hide animation, close for instant clear

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Add tabs component and refresh modal/logo UI

Polish mobile navigation and palette wrap