@layer components {
  .aa-skip { position: fixed; inset: var(--aa-sp-4) auto auto var(--aa-sp-4); z-index: var(--aa-z-modal); padding: var(--aa-sp-3) var(--aa-sp-5); background: var(--aa-bg-elevated); transform: translateY(-200%); border-radius: var(--aa-r-md); }
  .aa-skip:focus { transform: none; }
  .aa-header { position: sticky; inset-block-start: 0; z-index: var(--aa-z-nav); border-bottom: var(--aa-bw) solid var(--aa-line); background: color-mix(in srgb,var(--aa-bg) 94%,transparent); backdrop-filter: blur(var(--aa-blur)); }
  .aa-header__inner { min-height: var(--aa-header-height); max-width: var(--aa-page-width); margin-inline: auto; padding-inline: var(--aa-gutter); display: flex; align-items: center; justify-content: space-between; gap: var(--aa-sp-3); }
  .aa-brand { display: flex; align-items: center; gap: var(--aa-sp-3); text-decoration: none; color: var(--aa-ink-strong); min-height: var(--aa-touch); }
  .aa-brand__mark { display: grid; place-items: center; width: var(--aa-touch); height: var(--aa-touch); background: var(--aa-grad-mist); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-md); }
  .aa-brand__name { font-size: var(--aa-fs-lg); letter-spacing: var(--aa-ls-wide); font-weight: 700; }
  .aa-brand__caption { display: none; font-size: var(--aa-fs-xs); color: var(--aa-ink-muted); letter-spacing: var(--aa-ls-wide); }
  .aa-tools { display: flex; align-items: center; gap: var(--aa-sp-2); }
  .aa-icon { width: var(--aa-icon-size); height: var(--aa-icon-size); flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .aa-control { min-width: var(--aa-touch); min-height: var(--aa-touch); padding: var(--aa-sp-2) var(--aa-sp-3); display: inline-flex; gap: var(--aa-sp-2); align-items: center; justify-content: center; color: var(--aa-ink); background: var(--aa-bg-elevated); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-pill); text-decoration: none; font-size: var(--aa-fs-sm); transition: transform var(--aa-dur-2) var(--aa-ease-hesitate) var(--aa-delay-beat); }
  .aa-control:hover { background: var(--aa-surface-hover); transform: translateY(var(--aa-press)); }
  .aa-control__label, .aa-control kbd { display: none; }
  .aa-progress { position: absolute; inset: auto 0 0; height: var(--aa-focus-width); background: var(--aa-accent); transform: scaleX(var(--aa-progress,0)); transform-origin: left; }
  .aa-layout { max-width: var(--aa-page-width); margin: auto; padding: var(--aa-sp-5) var(--aa-gutter); }
  .aa-sidebar { min-width: 0; }
  .aa-sidebar__panel { border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-lg); background: color-mix(in srgb,var(--aa-bg-elevated) 70%,transparent); padding: var(--aa-sp-3); }
  .aa-sidebar__toggle { min-height: var(--aa-touch); padding: var(--aa-sp-2) var(--aa-sp-3); cursor: pointer; font-size: var(--aa-fs-sm); font-weight: 600; }
  .aa-sidebar__intro { padding: var(--aa-sp-3); color: var(--aa-ink-muted); font-size: var(--aa-fs-xs); letter-spacing: var(--aa-ls-wide); }
  .aa-nav ul { list-style: none; padding: 0; }
  .aa-nav ul ul { padding-inline-start: var(--aa-sp-3); margin-inline-start: var(--aa-sp-3); border-inline-start: var(--aa-bw) solid var(--aa-line); }
  .aa-nav a { display: flex; align-items: center; min-height: var(--aa-touch); padding: var(--aa-sp-2) var(--aa-sp-3); border-radius: var(--aa-r-md); text-decoration: none; color: var(--aa-ink); font-size: var(--aa-fs-sm); line-height: var(--aa-lh-tight); }
  .aa-nav a:hover { background: var(--aa-bg-tint); }
  .aa-nav a[aria-current="page"] { background: var(--aa-surface-hover); font-weight: 700; color: var(--aa-ink-strong); box-shadow: inset var(--aa-focus-width) 0 var(--aa-accent); }
  .aa-nav details>summary { display: flex; align-items: center; cursor: pointer; list-style: none; }
  .aa-nav summary::-webkit-details-marker { display: none; }
  .aa-nav details>summary a { flex: 1; }
  .aa-nav summary::after { content: '+'; min-width: var(--aa-touch); min-height: var(--aa-touch); display: grid; place-items: center; color: var(--aa-ink-muted); }
  .aa-nav details[open]>summary::after { content: '−'; }
  .aa-sidebar__foot { margin-block-start: var(--aa-sp-5); padding: var(--aa-sp-3); border-top: var(--aa-bw) solid var(--aa-line); color: var(--aa-ink-muted); font-size: var(--aa-fs-xs); }
  .aa-content { min-width: 0; padding-block: var(--aa-sp-6); }
  .aa-article a { display: inline-flex; align-items: center; min-block-size: var(--aa-touch); }
  .aa-char :is(path,circle,ellipse) { vector-effect: non-scaling-stroke; }
  .aa-layout[data-home] > .aa-toc { display: none; }
  .aa-nav details > summary { min-height: var(--aa-touch); padding-inline-start: var(--aa-sp-3); font-size: var(--aa-fs-sm); justify-content: space-between; color: var(--aa-ink); border-radius: var(--aa-r-md); }
  .aa-nav details > summary:hover { background: var(--aa-bg-tint); }
  .aa-breadcrumb { color: var(--aa-ink-muted); font-size: var(--aa-fs-sm); display: flex; align-items: center; flex-wrap: wrap; gap: var(--aa-sp-2); margin-block-end: var(--aa-sp-6); }
  .aa-breadcrumb a { color: var(--aa-ink); text-decoration: none; min-height: var(--aa-touch); display: inline-flex; align-items: center; }
  .aa-eyebrow { font-size: var(--aa-fs-xs); color: var(--aa-ink-muted); letter-spacing: var(--aa-ls-wide); font-weight: 600; }
  .aa-hero { display: grid; gap: var(--aa-sp-6); padding-block: var(--aa-sp-4) var(--aa-sp-7); align-items: center; }
  .aa-hero__title { margin-block: var(--aa-sp-4) var(--aa-sp-5); font-size: var(--aa-fs-3xl); }
  .aa-hero__title span { display: block; }
  .aa-hero__title em { font-style: normal; position: relative; isolation: isolate; }
  .aa-hero__title em::after { content: ''; position: absolute; z-index: -1; inset: 70% calc(-1 * var(--aa-sp-1)) 0; background: var(--aa-sakura-200); border-radius: var(--aa-r-sm); opacity: .65; }
  .aa-hero__description { max-width: 38em; margin-block-end: var(--aa-sp-5); color: var(--aa-ink); }
  .aa-quote { color: var(--aa-ink-muted); font-family: var(--aa-font-serif); font-size: var(--aa-fs-sm); }
  .aa-quote::before { content: '「'; color: var(--aa-accent-strong); }.aa-quote::after { content: '」'; color: var(--aa-accent-strong); }
  .aa-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--aa-sp-4); margin-block-start: var(--aa-sp-6); }
  .aa-btn { min-height: var(--aa-touch); display: inline-flex; justify-content: center; align-items: center; gap: var(--aa-sp-3); padding: var(--aa-sp-3) var(--aa-sp-5); border-radius: var(--aa-r-pill); background: var(--aa-accent); color: var(--aa-plum-900); box-shadow: var(--aa-shadow-1); text-decoration: none; font-weight: 600; transition: transform var(--aa-dur-2) var(--aa-ease-hesitate) var(--aa-delay-beat); }
  .aa-btn:hover { transform: translateY(var(--aa-rise)); box-shadow: var(--aa-shadow-2); }
  .aa-btn:active { transform: translateY(var(--aa-press)) scale(var(--aa-press-scale)); }
  .aa-text-link { display: inline-flex; align-items: center; gap: var(--aa-sp-2); min-height: var(--aa-touch); color: var(--aa-ink); font-size: var(--aa-fs-sm); }
  .aa-hero__art { position: relative; justify-self: center; width: min(100%,var(--aa-art-size)); isolation: isolate; }
  .aa-hero__halo { position: absolute; inset: 12% 0 5%; border-radius: var(--aa-r-pill); background: var(--aa-grad-mist); opacity: .6; z-index: -1; }
  .aa-hero__note { position: absolute; inset: auto 0 var(--aa-sp-5) auto; padding: var(--aa-sp-2) var(--aa-sp-4); background: var(--aa-bg-elevated); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-pill); box-shadow: var(--aa-shadow-1); font-size: var(--aa-fs-xs); }
  .aa-section { margin-block: var(--aa-sp-7); }
  .aa-section__heading { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: space-between; gap: var(--aa-sp-3); margin-block-end: var(--aa-sp-5); }
  .aa-section__heading h2 { font-size: var(--aa-fs-xl); }
  .aa-section__heading p { font-size: var(--aa-fs-sm); color: var(--aa-ink-muted); }
  .aa-grid { display: grid; gap: var(--aa-sp-4); }
  .aa-card { position: relative; isolation: isolate; display: flex; flex-direction: column; align-items: start; gap: var(--aa-sp-3); padding: var(--aa-sp-5); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-lg); background: var(--aa-bg-elevated); box-shadow: var(--aa-shadow-1); text-decoration: none; color: var(--aa-ink); transition: transform var(--aa-dur-3) var(--aa-ease-hesitate) var(--aa-delay-beat); }
  .aa-card::before { content: ''; position: absolute; z-index: -1; inset: 0; border-radius: inherit; background-image: var(--aa-grain); opacity: var(--aa-noise-opacity); pointer-events: none; }
  .aa-card:hover { transform: translateY(var(--aa-rise)); box-shadow: var(--aa-shadow-2); }
  .aa-card__top { display: flex; align-items: center; justify-content: space-between; width: 100%; color: var(--aa-ink-muted); font-size: var(--aa-fs-xs); }
  .aa-card__icon { display: grid; place-items: center; width: var(--aa-touch); height: var(--aa-touch); background: var(--aa-card-tint); border-radius: var(--aa-r-md); color: var(--aa-ink); }
  .aa-card h3 { font-size: var(--aa-fs-lg); }.aa-card p { font-size: var(--aa-fs-sm); color: var(--aa-ink); }.aa-card__footer { color: var(--aa-ink-muted); font-size: var(--aa-fs-xs); margin-block-start: auto; padding-block-start: var(--aa-sp-2); }
  .aa-route { display: grid; gap: var(--aa-sp-4); padding: var(--aa-sp-5); background: var(--aa-card-tint); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-lg); }
  .aa-route__step { display: flex; align-items: center; gap: var(--aa-sp-4); min-height: var(--aa-touch); color: var(--aa-ink); text-decoration: none; }.aa-route__number { color: var(--aa-ink-muted); font-family: var(--aa-font-mono); font-size: var(--aa-fs-sm); }.aa-route__step span:last-child { display: block; font-size: var(--aa-fs-xs); color: var(--aa-ink-muted); }
  .aa-article { overflow-wrap: anywhere; }.aa-article>h1 { margin-block-end: var(--aa-sp-5); }.aa-article h2 { margin-block: var(--aa-sp-7) var(--aa-sp-5); font-size: var(--aa-fs-xl); }.aa-article h3 { margin-block: var(--aa-sp-6) var(--aa-sp-4); font-size: var(--aa-fs-lg); }.aa-article :is(p,ul,ol,figure,table,blockquote,pre,details) { margin-block: var(--aa-sp-4); }.aa-article li { margin-block: var(--aa-sp-2); }.aa-article :is(ul,ol) { padding-inline-start: var(--aa-sp-5); }.aa-article img { border-radius: var(--aa-r-md); margin-inline: auto; }.aa-article figcaption { font-size: var(--aa-fs-sm); color: var(--aa-ink-muted); text-align: center; }.aa-article :is(code,pre) { background: var(--aa-bg-tint); border-radius: var(--aa-r-sm); }.aa-article code { padding: var(--aa-sp-1); }.aa-article pre { padding: var(--aa-sp-4); overflow: auto; }.aa-article blockquote { padding: var(--aa-sp-3) var(--aa-sp-5); border-inline-start: var(--aa-focus-width) solid var(--aa-accent); background: var(--aa-bg-tint); border-radius: var(--aa-r-md); }.aa-article hr { margin-block: var(--aa-sp-6); border: 0; border-block-start: var(--aa-bw) solid var(--aa-line); }
  .aa-article details { padding: var(--aa-sp-3) var(--aa-sp-5); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-md); background: var(--aa-bg-elevated); }.aa-article summary { min-height: var(--aa-touch); cursor: pointer; padding-block: var(--aa-sp-2); }.aa-article details[open] summary { border-bottom: var(--aa-focus-width) solid var(--aa-accent); margin-bottom: var(--aa-sp-4); }
  .aa-table { overflow-x: auto; border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-md); margin-block: var(--aa-sp-5); }.aa-table table { border-collapse: collapse; width: 100%; margin: 0; }.aa-table :is(td,th) { padding: var(--aa-sp-3) var(--aa-sp-4); text-align: start; border-bottom: var(--aa-bw) solid var(--aa-line); }.aa-table th { background: var(--aa-card-tint); }.aa-table tr:nth-child(even) { background: var(--aa-bg-tint); }
  .aa-hint { padding: var(--aa-sp-4) var(--aa-sp-5); margin-block: var(--aa-sp-5); border: var(--aa-bw) solid var(--aa-line); border-inline-start: var(--aa-focus-width) solid var(--aa-accent-2); background: var(--aa-bg-tint); border-radius: var(--aa-r-md); }.aa-hint[data-kind="warning"] { border-inline-start-color: var(--aa-warning); }.aa-hint[data-kind="danger"] { border-inline-start-color: var(--aa-danger); }.aa-hint__label { font-size: var(--aa-fs-xs); font-weight: 700; color: var(--aa-ink); }.aa-hint>:last-child { margin-block-end: 0; }.aa-hint h3 { margin-block-start: var(--aa-sp-3); }
  .aa-video { display: grid; place-items: center; gap: var(--aa-sp-4); min-height: 14rem; padding: var(--aa-sp-6); border-radius: var(--aa-r-lg); border: var(--aa-bw) solid var(--aa-line); background: var(--aa-grad-mist); text-align: center; margin-block: var(--aa-sp-5); }.aa-video p { font-size: var(--aa-fs-sm); color: var(--aa-plum-700); }.aa-video iframe { width: 100%; aspect-ratio: 16/9; border: 0; border-radius: var(--aa-r-md); }.aa-video[data-loaded] { padding: 0; background: none; }
  .aa-toc { display: none; }.aa-toc__heading { font-size: var(--aa-fs-xs); letter-spacing: var(--aa-ls-wide); color: var(--aa-ink-muted); margin-block-end: var(--aa-sp-4); }.aa-toc a { display: flex; align-items: center; min-height: var(--aa-touch); font-size: var(--aa-fs-xs); color: var(--aa-ink); text-decoration: none; border-inline-start: var(--aa-bw) solid var(--aa-line); padding-inline: var(--aa-sp-3); }.aa-toc a[aria-current] { border-inline-start: var(--aa-focus-width) solid var(--aa-accent); font-weight: 700; }
  .aa-pagination { display: grid; gap: var(--aa-sp-4); margin-block-start: var(--aa-sp-7); }.aa-pagination a { padding: var(--aa-sp-4) var(--aa-sp-5); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-lg); text-decoration: none; background: var(--aa-bg-elevated); color: var(--aa-ink); }.aa-pagination small { display: block; color: var(--aa-ink-muted); margin-block-end: var(--aa-sp-1); }
  .aa-footer { display: flex; flex-wrap: wrap; gap: var(--aa-sp-4); justify-content: space-between; color: var(--aa-ink-muted); font-size: var(--aa-fs-xs); margin-block-start: var(--aa-sp-7); padding-block: var(--aa-sp-5); border-top: var(--aa-bw) solid var(--aa-line); }.aa-footer a { min-height: var(--aa-touch); display: inline-flex; align-items: center; color: var(--aa-ink); }
  .aa-signature { position: fixed; right: var(--aa-sp-5); bottom: var(--aa-sp-3); font: italic var(--aa-fs-xl) var(--aa-font-hand); width: var(--aa-sign-size); color: var(--aa-eye-400); pointer-events: none; z-index: var(--aa-z-deco); }
  .aa-dialog { margin: auto; width: min(var(--aa-sheet-width),calc(100% - var(--aa-sp-6))); max-height: calc(100dvh - var(--aa-sp-7)); padding: var(--aa-sp-5); color: var(--aa-ink); background: var(--aa-bg-elevated); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-xl); box-shadow: var(--aa-shadow-3); }.aa-dialog::backdrop { background: var(--aa-overlay); backdrop-filter: blur(var(--aa-sp-1)); }.aa-dialog__top { display: flex; align-items: center; justify-content: space-between; gap: var(--aa-sp-4); margin-block-end: var(--aa-sp-4); }.aa-dialog h2 { font-size: var(--aa-fs-xl); }.aa-input { width: 100%; min-height: var(--aa-touch); border: var(--aa-bw) solid var(--aa-line); border-radius: var(--aa-r-md); padding: var(--aa-sp-3) var(--aa-sp-4); background: var(--aa-bg-tint); }.aa-results { list-style: none; padding: 0; max-height: 50dvh; overflow: auto; margin-block-start: var(--aa-sp-4); }.aa-results a { display: block; text-decoration: none; color: var(--aa-ink); padding: var(--aa-sp-4); border-radius: var(--aa-r-md); }.aa-results a:hover { background: var(--aa-bg-tint); }.aa-results p { font-size: var(--aa-fs-sm); color: var(--aa-ink-muted); }.aa-search__status { font-size: var(--aa-fs-sm); margin-block: var(--aa-sp-3); color: var(--aa-ink-muted); }
  .aa-char { width: 100%; height: auto; overflow: visible; stroke-linecap: round; stroke-linejoin: round; }.aa-char #aa-tail { transform-box: fill-box; transform-origin: 20% 90%; }.aa-char #aa-head { transform-box: fill-box; transform-origin: 50% 90%; }.aa-char :is(#aa-ear-l,#aa-ear-r,#aa-ahoge) { transform-box: fill-box; transform-origin: 50% 100%; }.aa-char .lid { transform-box: fill-box; transform-origin: center; }.aa-char #aa-blush { opacity: .4; }.aa-char[data-expression="shy"] #aa-blush { opacity: .8; }.aa-char[data-expression="shy"] #aa-head { transform: rotate(-3deg); }.aa-char[data-expression="think"] #aa-head { transform: rotate(2deg); }.aa-char[data-expression="daze"] #aa-head { transform: rotate(4deg); }.aa-char[data-expression="daze"] .lid { transform: scaleY(.6); }
  @media(min-width:480px) { .aa-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.aa-pagination { grid-template-columns: repeat(2,minmax(0,1fr)); }.aa-control__label { display: inline; } }
  @media(min-width:768px) { .aa-brand__caption { display: block; }.aa-hero { grid-template-columns: 1.2fr 1fr; }.aa-hero__title { font-size: var(--aa-fs-3xl); }.aa-route { grid-template-columns: repeat(3,minmax(0,1fr)); }.aa-control kbd { display: inline; font-size: var(--aa-fs-xs); color: var(--aa-ink-muted); } }
  @media(min-width:1024px) { .aa-layout { display: grid; grid-template-columns: var(--aa-sidebar-width) minmax(0,1fr); gap: var(--aa-sp-7); padding-block: var(--aa-sp-5); }.aa-sidebar { position: sticky; top: calc(var(--aa-header-height) + var(--aa-sp-5)); max-height: calc(100dvh - var(--aa-header-height) - var(--aa-sp-7)); overflow: auto; align-self: start; }.aa-sidebar__panel { border: 0; background: none; padding: 0; }.aa-sidebar__panel[open] > .aa-sidebar__toggle { display: none; }.aa-content { padding-block: var(--aa-sp-3); }.aa-hero { gap: var(--aa-sp-4); } }
  @media(min-width:1280px) { .aa-layout:not([data-home]) { grid-template-columns: var(--aa-sidebar-width) minmax(0,1fr) var(--aa-toc-width); gap: var(--aa-sp-6); }.aa-toc { display: block; position: sticky; top: calc(var(--aa-header-height) + var(--aa-sp-6)); align-self: start; max-height: calc(100dvh - var(--aa-header-height) - var(--aa-sp-7)); overflow: auto; padding-block-start: var(--aa-sp-5); }.aa-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
}