:root{color-scheme:light}.genre-page{margin:0;background:#f4f1e8;color:#183d32;font-family:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;line-height:1.8}.genre-page *{box-sizing:border-box}.genre-page a{color:inherit;text-underline-offset:4px}.genre-main{max-width:1200px;margin:auto;padding:32px 24px 64px}.genre-back{display:inline-block;margin-bottom:20px}.genre-hero{border:2px solid var(--accent);border-top:8px solid var(--accent);padding:42px;background:radial-gradient(#183d3218 .8px,transparent .8px) 0 0/7px 7px,#fffdf7;box-shadow:7px 7px 0 #183d3220}.genre-kicker{font-size:.8rem;font-weight:800;letter-spacing:.12em;color:var(--accent)}.genre-hero h1{font-size:clamp(1.8rem,4vw,3.25rem);line-height:1.5;max-width:850px;margin:16px 0}.genre-hero p{max-width:680px}.genre-total,.genre-pick{display:inline-block;background:var(--accent);color:#fff;padding:4px 13px;font-size:.8rem;font-weight:bold}.genre-ad{font-size:.75rem;margin:22px 0;color:#52665f}.genre-section-heading{margin:48px 0 20px;border-bottom:2px solid var(--accent)}.genre-section-heading span{font-size:.85rem}.genre-section-heading h2{font-size:1.6rem;margin:4px 0 12px}.genre-featured-grid,.genre-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.genre-book{background:#fffdf8;border:1px solid #ccd4cb;box-shadow:4px 4px 0 #183d3210;min-width:0;display:flex;flex-direction:column}.genre-featured{border:2px solid var(--accent)}.genre-cover{display:flex;height:260px;padding:20px;justify-content:center;background:radial-gradient(#183d321b .8px,transparent .8px) 0 0/6px 6px,#e9ede1}.genre-cover img{max-width:100%;height:100%;object-fit:contain;filter:drop-shadow(4px 5px 3px #183d3226)}.genre-book-copy{padding:20px;display:flex;flex-direction:column;flex:1;align-items:flex-start;min-width:0}.genre-book h3{line-height:1.55;font-size:1.12rem;margin:12px 0 4px;overflow-wrap:anywhere}.genre-book h3 a{text-decoration:none}.genre-author{font-size:.8rem;color:#59685e;margin:0 0 12px}.genre-description{font-size:.9rem;overflow-wrap:anywhere;margin-bottom:20px}.genre-description p{margin:0;line-height:1.95}.genre-buy{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;width:100%}.genre-buy a,.genre-buy span{text-align:center;font-size:.77rem;font-weight:800;padding:12px 4px;border-radius:4px;line-height:1.4;text-decoration:none;display:grid;place-items:center;min-height:44px}.genre-amazon{background:#ffb52c;color:#282617!important}.genre-dmm{background:#183d32;color:white!important}.genre-buy span{color:#606860;background:#eee}.genre-filter{display:flex;align-items:end;gap:16px;flex-wrap:wrap;background:#e8edde;padding:20px}.genre-filter label{font-size:.8rem;display:flex;flex-direction:column;gap:4px}.genre-filter label:first-child{flex:1;min-width:200px}.genre-filter input,.genre-filter select,.genre-filter button{font:inherit;min-height:46px;padding:10px;border:1px solid #82998b;border-radius:3px;max-width:100%;background:#fff}.genre-filter button{background:#183d32;color:#fff;cursor:pointer}.genre-filter>a{font-size:.8rem;padding:10px 0}.genre-result{font-weight:700}.genre-end{margin:54px 0 0;border-top:2px solid #183d32;padding-top:24px}.genre-end h2{font-size:1.3rem}.genre-end nav{display:flex;gap:12px;flex-wrap:wrap}.genre-end a{display:inline-block;border:1px solid #809489;padding:10px 16px;background:#fffdf8}.genre-footer{max-width:1200px;margin:0 auto;padding:24px;border-top:1px solid #bbc7b8;font-size:.8rem}.genre-footer p{max-width:900px}.genre-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:36px}.genre-index-card{background:#fffdf8;padding:26px;border:2px solid var(--accent);box-shadow:5px 5px 0 #183d321c;text-decoration:none}.genre-index-card h2{font-size:1.5rem;margin:8px 0}.genre-index-card p{margin:8px 0}.genre-mini-covers{height:190px;display:flex;gap:12px;justify-content:center;margin:24px 0}.genre-mini-covers img{height:100%;max-width:30%;object-fit:contain}.genre-page a:hover{text-decoration:underline}.genre-page :focus-visible{outline:3px solid #bc6138;outline-offset:4px}.genre-empty{grid-column:1/-1;padding:40px 0}.genre-image-failed{object-fit:contain}
@media(max-width:900px){.genre-grid,.genre-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.genre-featured-grid .genre-book:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.genre-featured-grid .genre-book:last-child .genre-cover{height:100%;min-height:260px}.genre-featured-grid .genre-book:last-child img{max-height:260px}}
@media(max-width:560px){.genre-main{padding:20px 14px 40px}.genre-hero{padding:24px 20px}.genre-hero h1{font-size:1.85rem}.genre-index{grid-template-columns:1fr;gap:18px}.genre-grid,.genre-featured-grid{gap:14px;grid-template-columns:1fr}.genre-book,.genre-featured-grid .genre-book:last-child{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:start}.genre-featured-grid .genre-book:last-child{grid-column:auto}.genre-cover,.genre-featured-grid .genre-book:last-child .genre-cover{height:180px;min-height:0;padding:14px 8px;background:transparent}.genre-book-copy{padding:14px 14px 14px 0}.genre-description{font-size:.86rem;margin:12px 0 16px}.genre-book h3{font-size:1.06rem;margin-top:4px}.genre-author{margin-bottom:0}.genre-pick{margin-bottom:8px}.genre-buy{gap:6px}.genre-buy a,.genre-buy span{font-size:.72rem;min-height:44px;padding:10px 4px}.genre-filter{gap:12px;padding:16px}.genre-filter label:first-child{flex-basis:100%}.genre-filter label:nth-child(2){flex:1}.genre-section-heading{margin-top:32px}.genre-mini-covers{height:175px}}

@media(max-width:560px){.genre-book-copy{display:contents}.genre-cover{grid-column:1;grid-row:1}.genre-identity{grid-column:2;grid-row:1;padding:18px 14px 10px 0;align-self:center}.genre-description{grid-column:1/-1;padding:0 16px;margin:0 0 16px}.genre-buy{grid-column:1/-1;width:auto;margin:0 16px 16px}.genre-buy a,.genre-buy span{font-size:.82rem}}
.genre-switch{position:sticky;top:74px;z-index:20;display:flex;gap:6px;max-width:520px;padding:6px;margin:0 auto 28px;background:#e3e8da;border:1px solid #a5b5a5;border-radius:40px;box-shadow:0 4px 12px #183d3215}.genre-switch a{flex:1;text-align:center;padding:10px 16px;border-radius:30px;text-decoration:none;font-weight:800;min-height:46px;line-height:1.6}.genre-switch a[aria-current=page]{background:var(--accent);color:#fff;box-shadow:0 2px 6px #183d3225}.genre-switch a:hover{text-decoration:none;background:#fff8}.genre-switch a[aria-current=page]:hover{background:var(--accent)}.genre-switch-status{position:absolute;top:100%;left:0;font-size:.75rem;background:inherit;border-radius:4px}.genre-switch-status:empty{display:none}.genre-page[data-genre-mood]{transition:background-color .15s,color .15s}.genre-page[data-genre-mood=bright]{background:#fff8df;color:#3f4426}.genre-page[data-genre-mood=bright] .genre-hero{background:radial-gradient(#c3932424 .8px,transparent .8px) 0 0/7px 7px,#fffef4;border-color:#c8ad4e}.genre-page[data-genre-mood=bright] .genre-cover{background-color:#f5edcd}.genre-page[data-genre-mood=bright] .genre-switch{background:#f5e9b9;border-color:#c9ae52}
.genre-page[data-genre-mood=dark]{background:#141b25;color:#e5e9f0;--accent:#9ba8d2!important}.genre-page[data-genre-mood=dark] .genre-hero{background:radial-gradient(#b2bdd32b .8px,transparent .8px) 0 0/7px 7px,#202936;border-color:#8592b2;box-shadow:7px 7px 0 #080d1680}.genre-page[data-genre-mood=dark] .genre-book{background:#202936;border-color:#697893}.genre-page[data-genre-mood=dark] .genre-cover{background-color:#18212d;background-image:radial-gradient(#b2bdd330 .8px,transparent .8px)}.genre-page[data-genre-mood=dark] .genre-author,.genre-page[data-genre-mood=dark] .genre-ad{color:#c4cedf}.genre-page[data-genre-mood=dark] .genre-filter,.genre-page[data-genre-mood=dark] .genre-switch{background:#263246;border-color:#7583a0}.genre-page[data-genre-mood=dark] .genre-filter input,.genre-page[data-genre-mood=dark] .genre-filter select{background:#161e2a;color:#e5e9f0;border-color:#7583a0}.genre-page[data-genre-mood=dark] .genre-filter input::placeholder{color:#b6c1d1}.genre-page[data-genre-mood=dark] .genre-filter button,.genre-page[data-genre-mood=dark] .genre-dmm{background:#394967;border:1px solid #7c8aaa}.genre-page[data-genre-mood=dark] .genre-total,.genre-page[data-genre-mood=dark] .genre-pick,.genre-page[data-genre-mood=dark] .genre-switch a[aria-current=page]{background:#afbbdf;color:#172235}.genre-page[data-genre-mood=dark] .genre-end a{background:#263246;border-color:#7583a0}.genre-page[data-genre-mood=dark] .genre-buy span{background:#303b4c;color:#d1d8e4}.genre-page[data-genre-mood=dark] #archive-menu-bar,.genre-page[data-genre-mood=dark] #archive-menu-dialog{background:#1b2431;color:#e5e9f0;border-color:#7583a0}.genre-page[data-genre-mood=dark] #archive-menu-toggle,.genre-page[data-genre-mood=dark] #archive-menu-close{background:#263246;color:#e5e9f0;border-color:#7583a0}.genre-page[data-genre-mood=dark] .archive-menu-lines i{background:#e5e9f0}.genre-page[data-genre-mood=dark] #archive-menu-dialog a{background:#263246;color:#e5e9f0;border-color:#7583a0}.genre-page[data-genre-mood=dark] #archive-menu-dialog small{color:#c4cedf}.genre-page[data-genre-mood=dark] .genre-end,.genre-page[data-genre-mood=dark] .genre-footer{border-color:#697893}
@media(max-width:560px){.genre-switch{top:72px;margin-bottom:20px}.genre-switch a{font-size:.9rem;padding:10px 8px}.genre-page[data-genre-mood=dark] .genre-cover{background:transparent}}
@media(prefers-reduced-motion:reduce){.genre-page[data-genre-mood]{transition:none}}

.genre-mbti-index{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:30px}.genre-mbti-index .genre-index-card{padding:20px}.genre-mbti-index .genre-mini-covers{height:150px;gap:8px}.genre-mbti-index img{max-width:48%}.genre-mbti-nav{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin:0 0 24px}.genre-mbti-nav a{padding:10px 4px;text-align:center;background:#fffdf8;border:1px solid #7c9489;text-decoration:none;font-weight:700}.genre-mbti-nav a[aria-current=page]{background:var(--accent);color:#fff}@media(max-width:800px){.genre-mbti-index{grid-template-columns:repeat(2,minmax(0,1fr))}.genre-mbti-nav{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:560px){.genre-mbti-index{gap:12px}.genre-mbti-index .genre-index-card{padding:14px}.genre-mbti-index .genre-mini-covers{height:110px}.genre-mbti-index strong{font-size:.85rem}}

.genre-page[data-genre-mood=dark] .archive-menu-brand,.genre-page[data-genre-mood=dark] .archive-menu-search{color:#e5e9f0!important}
