.test-page{min-height:100vh;background:#fafafa;padding:var(--space-lg) var(--space-base)}.test-header{max-width:1000px;margin:0 auto var(--space-2xl);text-align:center}.test-header-nav{display:flex;gap:var(--space-sm);justify-content:center;flex-wrap:wrap}.back-link,.test-header-nav{margin-bottom:var(--space-base)}.back-link{display:inline-block;padding:var(--space-xs) var(--space-base);background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-base);text-decoration:none;color:var(--color-text);transition:all var(--transition-base)}.back-link:hover{background:var(--color-text);color:#fff}.test-header h1{font-size:48px;margin-bottom:var(--space-sm)}.test-intro{font-size:18px;color:var(--color-text-secondary)}.test-content{max-width:1000px;margin:0 auto}.test-section{background:#fff;padding:var(--space-xl);margin-bottom:var(--space-xl);border-radius:var(--radius-md);border:1px solid var(--color-border)}.test-section h2{font-size:32px;margin-bottom:var(--space-lg);padding-bottom:var(--space-base);border-bottom:2px solid var(--color-border);text-align:left}.test-item{margin-bottom:var(--space-xl)}.test-item:last-child{margin-bottom:0}.test-item h3{font-size:20px;color:var(--color-text-secondary);margin-bottom:var(--space-sm);font-weight:600}.test-example{font-size:18px;line-height:1.8;color:var(--color-text);padding:var(--space-base);background:#fafafa;border-radius:var(--radius-base);border-left:3px solid var(--color-border)}.test-example.large-text{font-size:22px;line-height:1.8;padding:var(--space-lg)}.test-list{list-style:none;padding:0}.test-list li{font-size:18px;line-height:1.8;padding:var(--space-sm) var(--space-base);margin-bottom:var(--space-xs);background:#fafafa;border-radius:var(--radius-base)}.test-title{font-size:42px}.test-title,.test-title-h2{line-height:1.3;margin-bottom:var(--space-base)}.test-title-h2{font-size:36px}.test-title-h3{font-size:28px;line-height:1.3;margin-bottom:var(--space-base)}.doodle-demo{display:flex;align-items:center;gap:var(--space-base);padding:var(--space-lg);background:#fafafa;border-radius:var(--radius-base)}.doodle-demo p{margin:0;font-size:18px}.test-note{font-size:16px;color:var(--color-text-secondary);padding:var(--space-base);background:#fff9e6;border-radius:var(--radius-base);border-left:3px solid var(--color-accent)}.test-note strong{color:var(--color-text)}.test-footer{max-width:1000px;margin:var(--space-2xl) auto 0;text-align:center;padding-top:var(--space-xl);border-top:1px solid var(--color-border)}.icons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));grid-gap:var(--space-base);gap:var(--space-base);margin-top:var(--space-base)}.icon-demo{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);padding:var(--space-base);background:#fafafa;border-radius:var(--radius-base);border:1px solid var(--color-border);transition:all var(--transition-base)}.icon-demo:hover{background:#fff}.icon-demo span{font-size:12px;color:var(--color-text-secondary);font-family:monospace}.icon-sizes{display:flex;align-items:center;gap:var(--space-base);padding:var(--space-lg);background:#fafafa;border-radius:var(--radius-base)}.concept-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-gap:var(--space-base);gap:var(--space-base);margin-top:var(--space-base)}.concept-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-lg);background:#fff;border-radius:var(--radius-md);border:1px solid var(--color-border);gap:var(--space-sm);transition:all var(--transition-base)}.concept-card:hover{border-color:var(--color-accent)}.concept-card h4{font-size:18px;font-weight:600;margin:0}.concept-card p{font-size:14px;color:var(--color-text-secondary);margin:0;line-height:1.5}.badges-demo{display:flex;flex-wrap:wrap;gap:var(--space-sm);padding:var(--space-base);background:#fafafa}.badge,.badges-demo{border-radius:var(--radius-base)}.badge{display:inline-flex;align-items:center;gap:.35em;padding:.4em .8em;font-size:14px;font-weight:600;white-space:nowrap;transition:all var(--transition-base)}.badge--yellow{background:rgba(247,204,70,.2);color:var(--color-text);border:1px solid var(--color-accent)}.badge--mint{background:rgba(89,226,192,.2);color:var(--color-text);border:1px solid #59e2c0}.badge--dark{background:#000;color:#fff;border:1px solid #000}.badge--outline{background:transparent;color:var(--color-text);border:1px solid var(--color-border)}.rating-demo{display:flex;align-items:center;gap:.25em;padding:var(--space-base);background:#fafafa;border-radius:var(--radius-base)}.rating-text{margin-left:var(--space-sm);font-size:16px;font-weight:600;color:var(--color-text)}@media (max-width:768px){.test-page{padding:var(--space-base) var(--space-sm)}.test-header h1{font-size:32px}.test-section{padding:var(--space-base)}.test-section h2{font-size:24px}.test-example{font-size:16px}.test-example.large-text{font-size:18px}.test-title{font-size:28px}.test-title-h2{font-size:24px}.doodle-demo{flex-wrap:wrap}.icons-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.concept-cards{grid-template-columns:1fr}}