.article-page{max-width:800px;margin:1.5rem auto;background-color:var(--color-surface-card);border:1px solid var(--color-border-primary);border-radius:var(--border-radius-base);padding:1.5rem 2rem;box-shadow:0 4px 12px var(--color-shadow-default);transition:background-color .3s ease,border-color .3s ease}.article-page h1,.article-page h2,.article-page h3{line-height:1.3;margin-bottom:1rem;margin-top:1.5rem}.article-page h1{font-size:2.2rem;text-align:center;border-bottom:2px solid var(--color-border-secondary);padding-bottom:1rem;margin-top:0}.article-page h2{font-size:1.8rem;color:var(--color-primary-base);border-bottom:1px solid var(--color-border-primary);padding-bottom:.5rem}.article-page h3{font-size:1.4rem;color:var(--color-text-primary)}.article-page p,.article-page li{font-size:1.1rem;line-height:1.7;color:var(--color-text-primary);margin-bottom:1.2rem}.article-page ul,.article-page ol{margin-left:2rem;margin-bottom:1.5rem}.article-page a{color:var(--color-text-link);text-decoration:underline;font-weight:500}.article-page a:hover{color:var(--color-text-link-hover)}.article-page strong{font-weight:600;color:inherit}.article-image{margin:2rem 0;text-align:center}.article-image img{max-width:100%;height:auto;border-radius:var(--border-radius-base);box-shadow:0 4px 8px var(--color-shadow-default)}.article-image figcaption{font-size:.9rem;color:var(--color-text-secondary);margin-top:.5rem;font-style:italic}.article-callout{border-left:4px solid var(--color-primary-base);background-color:rgba(24,38,65,0.05);padding:1rem 1.25rem;border-radius:var(--border-radius-base);margin:1.5rem 0}.article-callout strong{display:block;font-size:1.1rem;margin-bottom:.5rem}.article-callout ul{margin:0;padding-left:1.2rem}.article-callout li{margin-bottom:.5rem}.article-cta{display:flex;justify-content:center;gap:1rem;margin-top:2rem;flex-wrap:wrap}@media(max-width:767px){.article-page{padding:1rem 1.5rem}.article-page h1{font-size:1.8rem}.article-page h2{font-size:1.5rem}.article-page p,.article-page li{font-size:1rem}}.table-responsive{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.article-page table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:1rem;background-color:var(--color-surface-card);min-width:720px}.article-page caption{caption-side:bottom;padding:.75rem 0;font-size:.95rem;color:var(--color-text-secondary);text-align:left}.article-page th,.article-page td{border:1px solid var(--color-border-primary);padding:.75rem 1rem;text-align:left;vertical-align:top;color:var(--color-text-primary);background-color:inherit}.article-page th{font-weight:600;background:color-mix(in srgb,var(--color-primary-base) 12%,var(--color-surface-card));color:var(--color-text-primary);letter-spacing:.01em;white-space:nowrap}.article-page tbody tr:nth-child(even){background:color-mix(in srgb,var(--color-surface-highlight) 55%,transparent)}.article-page tbody tr:hover{background:color-mix(in srgb,var(--color-primary-base) 8%,var(--color-surface-card))}.table-responsive{margin:1.5rem 0;border:1px solid var(--color-border-primary);border-radius:var(--border-radius-base);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--color-primary-base) 10%,transparent)}.table-responsive>table{border-radius:inherit;margin:0}@media(max-width:768px){.article-page table{font-size:.95rem;min-width:640px}.article-page th,.article-page td{padding:.65rem .75rem}}@media(max-width:576px){.article-page table{min-width:560px}.table-responsive{margin:1rem 0}}@media(max-width:420px){.article-page table{font-size:.9rem;min-width:480px}.article-page th,.article-page td{padding:.55rem .6rem}}:root{--homepage-grid-gap:clamp(1rem,2.2vw,1.8rem);--homepage-card-padding:clamp(1.15rem,2vw,1.8rem);--homepage-card-icon-size:clamp(2.2rem,3vw,2.7rem);--homepage-card-icon-bg:color-mix(in srgb,var(--color-primary-base) 12%,transparent);--homepage-card-icon-color:var(--color-primary-base)}.content-section{display:flex;flex-direction:column;gap:clamp(0.75rem,2vw,1.25rem)}.content-grid{display:grid;gap:var(--homepage-grid-gap);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));align-items:stretch}.card.content-card{position:relative;padding:var(--homepage-card-padding);display:flex;flex-direction:column;gap:clamp(0.6rem,1.6vw,1rem);border:1px solid var(--color-border-primary);background-color:var(--color-surface-card);box-shadow:0 10px 28px color-mix(in srgb,var(--color-shadow-default) 65%,transparent);transition:transform .25s ease,box-shadow .3s ease,border-color .3s ease,background-color .3s ease}.card.content-card:hover,.card.content-card:focus-within{transform:translateY(-4px);box-shadow:0 16px 34px color-mix(in srgb,var(--color-shadow-default) 85%,transparent);border-color:color-mix(in srgb,var(--color-primary-base) 30%,var(--color-border-primary))}.card.content-card .content-icon-badge{align-self:flex-start}.content-card__title{margin:0;font-size:clamp(1.1rem,2vw,1.35rem);color:var(--color-text-primary);font-weight:600}.content-card__body{display:flex;flex-direction:column;gap:clamp(0.55rem,1.4vw,0.9rem)}.content-icon-badge{width:var(--homepage-card-icon-size);height:var(--homepage-card-icon-size);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background-color:var(--homepage-card-icon-bg);color:var(--homepage-card-icon-color);box-shadow:inset 0 1px 2px color-mix(in srgb,var(--color-primary-base) 35%,transparent)}.content-icon-badge .icon{font-size:1.2em}.content-list{margin:0;padding:0;list-style:none;display:grid;gap:var(--homepage-grid-gap)}.content-list--numbered{counter-reset:content-step}.content-list--numbered>li{counter-increment:content-step;list-style:none}.content-list--numbered>li .content-card--numbered{padding-left:calc(var(--homepage-card-padding)+var(--homepage-card-icon-size)+0.85rem)}.content-list--numbered>li .content-card--numbered::before{content:counter(content-step);position:absolute;top:var(--homepage-card-padding);left:var(--homepage-card-padding);width:var(--homepage-card-icon-size);height:var(--homepage-card-icon-size);border-radius:50%;background-color:var(--homepage-card-icon-bg);color:var(--homepage-card-icon-color);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:inset 0 1px 2px color-mix(in srgb,var(--color-primary-base) 35%,transparent)}.content-list--bulleted{list-style:disc;margin-left:1.3rem;gap:clamp(0.4rem,1.2vw,0.75rem)}.ten-finger-training .content-card,.landing-section.content-card{border-color:color-mix(in srgb,var(--color-primary-base) 22%,var(--color-border-primary));background-image:linear-gradient(180deg,color-mix(in srgb,var(--color-primary-base) 8%,transparent),transparent 65%)}.ten-finger-basics .content-card{border-color:color-mix(in srgb,var(--color-secondary-base) 18%,var(--color-border-primary));background-image:linear-gradient(180deg,color-mix(in srgb,var(--color-secondary-base) 8%,transparent),transparent 65%)}.training-interpretation .content-card--numbered{border-color:color-mix(in srgb,var(--color-text-primary) 18%,var(--color-border-primary))}.landing-faq .content-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}.landing-faq__item.card.content-card{gap:clamp(0.45rem,1.3vw,0.8rem)}.landing-howto__steps.content-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}.landing-howto__steps .content-card__title{font-size:clamp(1rem,1.8vw,1.2rem)}@media(max-width:767px){.content-grid{grid-template-columns:1fr}.content-list--numbered>li .content-card--numbered{padding-left:calc(var(--homepage-card-padding)+var(--homepage-card-icon-size)+0.65rem)}}@media(max-width:575px){:root{--homepage-card-padding:clamp(1rem,5vw,1.4rem)}.card.content-card{box-shadow:0 6px 18px color-mix(in srgb,var(--color-shadow-default) 65%,transparent)}}@media(prefers-reduced-motion:reduce){.card.content-card,.card.content-card:focus-within,.content-icon-badge,.content-list,.content-list--numbered>li .content-card--numbered,.landing-faq__item.card.content-card,.feature-item{transition:none!important}.card.content-card,.card.content-card:hover,.card.content-card:focus-within,.feature-item,.feature-item:hover{transform:none!important}}