:root{--color-bg:#0d0d0d;--color-bg-card:#1a1a1a;--color-bg-elevated:#222;--color-text-primary:#f5f5f5;--color-text-secondary:#999;--color-accent:#c8a96e;--color-accent-dim:hsla(39,45%,61%,.15);--color-correct:#2ecc71;--color-correct-dim:rgba(46,204,113,.15);--color-incorrect:#ff5f5f;--color-incorrect-dim:rgba(255,95,95,.15);--color-border:#2a2a2a;--color-border-hover:#3a3a3a;--font-serif:"Playfair Display","Noto Serif JP",serif;--font-sans:"Inter","Noto Sans JP",sans-serif;--text-xs:0.75rem;--text-sm:0.875rem;--text-base:0.9375rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--shadow-sm:0 1px 4px rgba(0,0,0,.4);--shadow-md:0 4px 16px rgba(0,0,0,.5);--transition-fast:150ms ease;--transition-base:250ms ease;--nav-height:56px;--max-width:768px;--max-width-wide:1080px}@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@400;500;600&family=Noto+Serif+JP:wght@400;600&family=Noto+Sans+JP:wght@400;500&display=swap");*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{background-color:var(--color-bg);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-base);line-height:1.6;min-height:100vh;padding-top:var(--nav-height)}a{color:var(--color-accent);text-decoration:none;transition:opacity var(--transition-fast)}a:hover{opacity:.8}img{max-width:100%;height:auto;display:block}button{cursor:pointer;border:none;background:none;font-family:inherit;font-size:inherit}ol,ul{list-style:none}.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-height);background-color:hsla(0,0%,5%,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);padding:0 var(--space-4)}.nav,.nav__inner{display:flex;align-items:center}.nav__inner{width:100%;max-width:var(--max-width-wide);margin:0 auto;justify-content:space-between}.nav__logo{font-family:var(--font-serif);font-size:var(--text-lg);font-weight:700;color:var(--color-accent);letter-spacing:.02em}.nav__links{display:flex;gap:var(--space-6)}.nav__link{font-size:var(--text-sm);font-weight:500;color:var(--color-text-secondary);letter-spacing:.04em;text-transform:uppercase;transition:color var(--transition-fast)}.nav__link.is-active,.nav__link:hover{color:var(--color-accent);opacity:1}.page{min-height:calc(100vh - var(--nav-height));padding:var(--space-8) var(--space-4) var(--space-16)}.container{max-width:var(--max-width);margin:0 auto}.container--wide{max-width:var(--max-width-wide);margin:0 auto}.page-header{margin-bottom:var(--space-8)}.page-header__eyebrow{font-size:var(--text-xs);font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent);margin-bottom:var(--space-2)}.page-header__title{font-family:var(--font-serif);font-size:var(--text-3xl);font-weight:700;line-height:1.2;color:var(--color-text-primary)}.page-header__description{margin-top:var(--space-3);color:var(--color-text-secondary);font-size:var(--text-base)}.loading{display:flex;justify-content:center;align-items:center;padding:var(--space-16);font-size:var(--text-sm);letter-spacing:.05em}.error-message,.loading{color:var(--color-text-secondary)}.error-message{text-align:center;padding:var(--space-16) var(--space-4)}.error-message__title{font-size:var(--text-xl);margin-bottom:var(--space-2);color:var(--color-text-primary)}.filter-bar{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-6)}.filter-btn{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);border:1px solid var(--color-border);font-size:var(--text-xs);font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--color-text-secondary);background:transparent;transition:all var(--transition-fast)}.filter-btn:hover{border-color:var(--color-accent);color:var(--color-accent)}.filter-btn.is-active{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-bg)}.grid{display:grid;grid-gap:var(--space-4);gap:var(--space-4);grid-template-columns:1fr}@media (min-width:600px){.grid--2col{grid-template-columns:repeat(2,1fr)}}@media (min-width:769px){.grid--3col{grid-template-columns:repeat(3,1fr)}}.footer{border-top:1px solid var(--color-border);margin-top:var(--space-16);padding:var(--space-10) var(--space-4) var(--space-6)}.footer__inner{max-width:var(--max-width-wide);margin:0 auto;display:flex;justify-content:space-between;gap:var(--space-8);flex-wrap:wrap}.footer__brand{flex:1 1;min-width:180px}.footer__logo{font-family:var(--font-serif);font-size:var(--text-lg);font-weight:700;color:var(--color-accent);margin-bottom:var(--space-2)}.footer__tagline{font-size:var(--text-xs);color:var(--color-text-secondary);line-height:1.8}.footer__nav{display:flex;gap:var(--space-10)}.footer__nav-group{min-width:110px}.footer__nav-title{font-size:var(--text-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-primary);margin-bottom:var(--space-3)}.footer__nav-group ul{display:flex;flex-direction:column;gap:var(--space-2)}.footer__nav-group a{font-size:var(--text-xs);color:var(--color-text-secondary)}.footer__nav-group a:hover{color:var(--color-accent);opacity:1}.footer__bottom{max-width:var(--max-width-wide);margin:var(--space-6) auto 0;padding-top:var(--space-4);border-top:1px solid var(--color-border);text-align:center;font-size:var(--text-xs);color:var(--color-text-secondary)}@media (max-width:600px){.footer__inner{flex-direction:column}.footer__inner,.footer__nav{gap:var(--space-6)}}@media (max-width:480px){.nav__links{gap:var(--space-4)}.nav__link{font-size:var(--text-xs)}.page-header__title{font-size:var(--text-2xl)}}.article-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;transition:border-color var(--transition-base),transform var(--transition-base);cursor:pointer;display:block}.article-card:hover{border-color:var(--color-accent);transform:translateY(-2px);opacity:1}.article-card__image{object-fit:cover}.article-card__image,.article-card__image-placeholder{width:100%;aspect-ratio:16/9;background:var(--color-bg-elevated)}.article-card__image-placeholder{display:flex;align-items:center;justify-content:center;font-size:var(--text-3xl);color:var(--color-border)}.article-card__body{padding:var(--space-4)}.article-card__category{font-size:var(--text-xs);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent);margin-bottom:var(--space-1)}.article-card__date{display:block;font-size:var(--text-xs);color:var(--color-text-secondary);margin-bottom:var(--space-2)}.article-card__title{font-family:var(--font-serif);font-size:var(--text-lg);font-weight:600;line-height:1.4;color:var(--color-text-primary);margin-bottom:var(--space-2)}.article-card__excerpt{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.article-card__tags{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-top:var(--space-3)}.tag{display:inline-block;padding:2px var(--space-2);border-radius:var(--radius-full);font-size:var(--text-xs);color:var(--color-text-secondary)}.quiz-card,.tag{border:1px solid var(--color-border)}.quiz-card{background:var(--color-bg-card);border-radius:var(--radius-lg);padding:var(--space-5);cursor:pointer;transition:border-color var(--transition-base),transform var(--transition-base);display:block}.quiz-card:hover{border-color:var(--color-accent);transform:translateY(-2px);opacity:1}.quiz-card.is-answered{border-color:transparent;opacity:.6}.quiz-card.is-answered.is-correct{border-color:var(--color-correct);opacity:.8}.quiz-card__header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-2);margin-bottom:var(--space-3)}.quiz-card__category{font-size:var(--text-xs);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent)}.quiz-card__difficulty{font-size:var(--text-xs);padding:2px var(--space-2);border-radius:var(--radius-full);border:1px solid var(--color-border);color:var(--color-text-secondary)}.quiz-card__question{font-size:var(--text-base);font-weight:500;color:var(--color-text-primary);line-height:1.5}.quiz-card__status{margin-top:var(--space-3);font-size:var(--text-xs);color:var(--color-text-secondary)}.quiz-card__status.is-correct{color:var(--color-correct)}.quiz-play{max-width:600px;margin:0 auto}.quiz-play__meta{display:flex;gap:var(--space-2);margin-bottom:var(--space-6)}.quiz-play__question{font-family:var(--font-serif);font-size:var(--text-2xl);font-weight:600;line-height:1.4;color:var(--color-text-primary);margin-bottom:var(--space-8)}.quiz-play__options{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-6)}.option-btn{width:100%;padding:var(--space-4) var(--space-5);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);text-align:left;font-size:var(--text-base);color:var(--color-text-primary);min-height:56px;gap:var(--space-3)}.option-btn,.option-btn__label{transition:all var(--transition-fast);display:flex;align-items:center}.option-btn__label{flex-shrink:0;width:28px;height:28px;border-radius:50%;border:1px solid var(--color-border);justify-content:center;font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary)}.option-btn:hover:not(:disabled){border-color:var(--color-accent);background:var(--color-accent-dim)}.option-btn:hover:not(:disabled) .option-btn__label{border-color:var(--color-accent);color:var(--color-accent)}.option-btn.is-correct{border-color:var(--color-correct);background:var(--color-correct-dim)}.option-btn.is-correct .option-btn__label{background:var(--color-correct);border-color:var(--color-correct);color:var(--color-bg)}.option-btn.is-incorrect{border-color:var(--color-incorrect);background:var(--color-incorrect-dim)}.option-btn.is-incorrect .option-btn__label{background:var(--color-incorrect);border-color:var(--color-incorrect);color:var(--color-bg)}.option-btn:disabled{cursor:default}.explanation{background:var(--color-bg-elevated);border-left:3px solid var(--color-accent);border-radius:0 var(--radius-md) var(--radius-md) 0;padding:var(--space-4) var(--space-5);margin-bottom:var(--space-6)}.explanation__result{font-weight:600;font-size:var(--text-lg);margin-bottom:var(--space-2)}.explanation__result.is-correct{color:var(--color-correct)}.explanation__result.is-incorrect{color:var(--color-incorrect)}.explanation__text{color:var(--color-text-secondary);line-height:1.7}.btn,.explanation__text{font-size:var(--text-sm)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);font-weight:600;letter-spacing:.03em;transition:all var(--transition-fast);min-height:44px}.btn--primary{background:var(--color-accent);color:var(--color-bg)}.btn--primary:hover{opacity:.9}.btn--outline{border:1px solid var(--color-border);color:var(--color-text-secondary);background:transparent}.btn--outline:hover{border-color:var(--color-accent);color:var(--color-accent);opacity:1}.btn--ghost{color:var(--color-text-secondary);background:transparent}.btn--ghost:hover{color:var(--color-text-primary);opacity:1}.badges-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));grid-gap:var(--space-3);gap:var(--space-3)}.badge-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);text-align:center;transition:border-color var(--transition-fast)}.badge-card.is-earned{border-color:var(--color-accent);background:var(--color-accent-dim)}.badge-card.is-locked{opacity:.4}.badge-card__icon{font-size:2rem;margin-bottom:var(--space-2)}.badge-card__name{font-size:var(--text-sm);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-1)}.badge-card__description{font-size:var(--text-xs);color:var(--color-text-secondary);line-height:1.4}.score-summary{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:var(--space-3);gap:var(--space-3);margin-bottom:var(--space-8)}.score-item{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);text-align:center}.score-item__value{font-family:var(--font-serif);font-size:var(--text-3xl);font-weight:700;color:var(--color-accent);line-height:1;margin-bottom:var(--space-1)}.score-item__label{font-size:var(--text-xs);color:var(--color-text-secondary);letter-spacing:.05em}.hero{padding:var(--space-12) 0 var(--space-10);text-align:center}.hero__eyebrow{font-size:var(--text-xs);font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--color-accent)}.hero__eyebrow,.hero__title{margin-bottom:var(--space-4)}.hero__title{font-family:var(--font-serif);font-size:clamp(var(--text-3xl),6vw,var(--text-4xl));font-weight:700;line-height:1.2;color:var(--color-text-primary)}.hero__description{font-size:var(--text-base);color:var(--color-text-secondary);max-width:480px;margin:0 auto var(--space-8);line-height:1.7}.hero__cta{display:flex;gap:var(--space-3);justify-content:center;flex-wrap:wrap}.section{margin-bottom:var(--space-12)}.section__header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--space-5)}.section__title{font-family:var(--font-serif);font-size:var(--text-xl);font-weight:600;color:var(--color-text-primary)}.section__more{font-size:var(--text-xs);font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--color-accent)}.article-detail{max-width:680px;margin:0 auto}.article-detail__cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius-lg);margin-bottom:var(--space-8);background:var(--color-bg-elevated)}.article-detail__meta{display:flex;gap:var(--space-4);align-items:center;margin-bottom:var(--space-4);flex-wrap:wrap}.article-detail__category{font-size:var(--text-xs);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent)}.article-detail__date{font-size:var(--text-xs);color:var(--color-text-secondary)}.article-detail__title{font-family:var(--font-serif);font-size:clamp(var(--text-2xl),5vw,var(--text-3xl));font-weight:700;line-height:1.3;color:var(--color-text-primary);margin-bottom:var(--space-6)}.article-detail__tags{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-bottom:var(--space-8);padding-bottom:var(--space-8);border-bottom:1px solid var(--color-border)}.article-body{color:var(--color-text-primary);line-height:1.8;font-size:var(--text-base)}.article-body h2{font-size:var(--text-2xl);margin:var(--space-8) 0 var(--space-4)}.article-body h2,.article-body h3{font-family:var(--font-serif);font-weight:600;color:var(--color-text-primary)}.article-body h3{font-size:var(--text-xl);margin:var(--space-6) 0 var(--space-3)}.article-body p{margin-bottom:var(--space-4);color:var(--color-text-secondary)}.article-body strong{color:var(--color-text-primary);font-weight:600}.article-body ol,.article-body ul{margin-bottom:var(--space-4);padding-left:var(--space-5)}.article-body ul{list-style:disc}.article-body ol{list-style:decimal}.article-body li{margin-bottom:var(--space-1);color:var(--color-text-secondary)}.article-body blockquote{border-left:3px solid var(--color-accent);padding:var(--space-3) var(--space-5);margin:var(--space-6) 0;background:var(--color-bg-elevated);border-radius:0 var(--radius-md) var(--radius-md) 0;font-style:italic;color:var(--color-text-secondary)}.related-quiz{margin-top:var(--space-10);padding-top:var(--space-8);border-top:1px solid var(--color-border)}.related-quiz__title{font-family:var(--font-serif);font-size:var(--text-xl);font-weight:600;margin-bottom:var(--space-4)}.history-list{display:flex;flex-direction:column;gap:var(--space-2)}.history-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm)}.history-item__status{font-size:var(--text-base);flex-shrink:0}.history-item__question{flex:1 1;color:var(--color-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-item__date{flex-shrink:0;font-size:var(--text-xs)}.empty-state,.history-item__date{color:var(--color-text-secondary)}.empty-state{text-align:center;padding:var(--space-12) var(--space-4)}.empty-state__icon{font-size:3rem;margin-bottom:var(--space-4)}.empty-state__title{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-2)}.empty-state__description{font-size:var(--text-sm);margin-bottom:var(--space-6)}.search-bar{margin-bottom:var(--space-4)}.search-input{width:100%;max-width:400px;padding:var(--space-3) var(--space-4);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-full);font-family:var(--font-sans);font-size:var(--text-sm);color:var(--color-text-primary);outline:none;transition:border-color var(--transition-fast)}.search-input::placeholder{color:var(--color-text-secondary)}.search-input:focus{border-color:var(--color-accent)}.search-input::-webkit-search-cancel-button{cursor:pointer}.back-link{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-6);transition:color var(--transition-fast)}.back-link:hover{color:var(--color-accent);opacity:1}.prose h2{font-family:var(--font-serif);font-size:var(--text-xl);margin:var(--space-8) 0 var(--space-3);color:var(--color-text-primary)}.prose li,.prose p{color:var(--color-text-secondary);line-height:1.8;margin-bottom:var(--space-3)}.prose ul{padding-left:var(--space-5);list-style:disc}.prose a{color:var(--color-accent)}.info-table{width:100%;border-collapse:collapse;margin-bottom:var(--space-6)}.info-table td,.info-table th{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);text-align:left;font-size:var(--text-sm)}.info-table th{color:var(--color-text-secondary);font-weight:500;width:30%}.info-table td{color:var(--color-text-primary)}.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:1000;background:var(--color-bg-elevated);border-top:1px solid var(--color-border);padding:var(--space-4) var(--space-6);display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}.cookie-banner__text{flex:1 1;font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;min-width:200px;line-height:1.6}.cookie-banner__text a{color:var(--color-accent);text-decoration:underline}.cookie-banner__actions{display:flex;gap:var(--space-3);flex-shrink:0}.cookie-banner__btn{padding:var(--space-2) var(--space-5);border-radius:var(--radius-sm);font-size:var(--text-sm);cursor:pointer;transition:opacity var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast);border:1px solid transparent;font-family:var(--font-sans)}.cookie-banner__btn--accept{background:var(--color-accent);color:#000;border-color:var(--color-accent);font-weight:600}.cookie-banner__btn--accept:hover{opacity:.85}.cookie-banner__btn--decline{background:transparent;color:var(--color-text-secondary);border-color:var(--color-border)}.cookie-banner__btn--decline:hover{color:var(--color-text-primary);border-color:var(--color-border-hover)}.ad-unit{margin:var(--space-8) 0}.ad-unit--article-bottom{margin-top:var(--space-10);padding-top:var(--space-8);border-top:1px solid var(--color-border)}