:root{--accent:#0d9488;--accent-dark:#0f766e;--accent-tint:#f0fdfa;--ink:#1f2937;--ink-sub:#5b6b7a;--line:#dbe4e8;--bg:#fff;--radius:16px;--pop-red:#dc2626;--pop-yellow:#fde047}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--ink);margin:0;font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,Yu Gothic UI,sans-serif;line-height:1.75}a{color:var(--accent-dark)}.wrap{max-width:960px;margin:0 auto;padding:0 16px}.site-header{border-bottom:1px solid var(--line);background:#fff;position:relative}.site-header:before{content:"";background:linear-gradient(90deg,#38bdf8 0 20%,#6366f1 20% 40%,#fb923c 40% 60%,#2dd4bf 60% 80%,#f59e0b 80% 100%);height:6px;display:block}.site-header .wrap{flex-wrap:wrap;align-items:center;gap:8px 24px;padding-top:12px;padding-bottom:12px;display:flex}.site-logo{color:var(--ink);letter-spacing:.02em;align-items:center;gap:10px;font-size:1.3rem;font-weight:800;text-decoration:none;display:inline-flex}.site-logo .logo-mark{background:linear-gradient(135deg, var(--accent), #2dd4bf);color:#fff;border-radius:9px;justify-content:center;align-items:center;width:34px;height:34px;font-size:1rem;display:inline-flex;box-shadow:0 2px 6px #0d948859}.site-nav{flex-wrap:wrap;gap:18px;margin-left:auto;display:flex}.site-nav a{color:var(--ink);font-size:.95rem;font-weight:600;text-decoration:none}.site-nav a:hover{color:var(--accent-dark);text-decoration:underline}.hero{background:linear-gradient(160deg,#f0fdfa 0%,#ecfeff 55%,#fff7ed 100%);padding:44px 0 0;position:relative;overflow:hidden}.hero:before{content:"";pointer-events:none;background-image:radial-gradient(#0d948829 2.2px,#0000 2.6px);background-size:22px 22px;position:absolute;inset:0}.hero:after{content:"";aspect-ratio:1;pointer-events:none;background:repeating-conic-gradient(#f59e0b12 0deg 4deg,#0000 4deg 9deg);border-radius:50%;width:70%;position:absolute;top:-40%;right:-15%}.hero-inner{z-index:1;position:relative}.hero-badge-row{flex-wrap:wrap;gap:8px;margin:0 0 14px;display:flex}.hero-badge{border:2px solid var(--accent);color:var(--accent-dark);background:#fff;border-radius:999px;padding:1px 12px;font-size:.8rem;font-weight:700}.hero-badge:nth-child(2){color:#b45309;border-color:#f59e0b}.hero-badge:nth-child(3){color:#4338ca;border-color:#6366f1}.hero h1{letter-spacing:.01em;margin:0 0 12px;font-size:clamp(1.75rem,6vw,2.7rem);font-weight:900;line-height:1.35}.hero h1 .marker{background:linear-gradient(transparent 58%, var(--pop-yellow) 58%);padding:0 4px}.hero-lead{color:var(--ink-sub);max-width:42em;margin:0}.spine-row{align-items:flex-end;gap:6px;margin-top:26px;display:flex}.spine{writing-mode:vertical-rl;background:linear-gradient(180deg, var(--cover-from), var(--cover-to));color:#fff;letter-spacing:.08em;white-space:nowrap;border-radius:5px 5px 0 0;justify-content:center;align-items:center;width:36px;height:118px;padding:8px 0;font-size:.78rem;font-weight:800;display:inline-flex;overflow:hidden;box-shadow:inset 3px 0 #0000002e}.spine:nth-child(2){height:104px}.spine:nth-child(3){height:124px}.spine:nth-child(4){height:98px}.spine:nth-child(5){height:110px}.hero-stripes{z-index:1;background:linear-gradient(90deg,#38bdf8 0 20%,#6366f1 20% 40%,#fb923c 40% 60%,#2dd4bf 60% 80%,#f59e0b 80% 100%);height:10px;margin-top:0;position:relative}.band{padding:42px 0 34px}.band--white{background:#fff}.band--sunny{background-color:#fff7ed;background-image:radial-gradient(#f59e0b1a 1.8px,#0000 2.2px);background-size:24px 24px}.band--mist{background:var(--accent-tint)}.section-title{margin:0 0 8px;font-size:1.45rem;font-weight:900;line-height:1.4}.section-title span{background:linear-gradient(90deg, var(--accent), #f59e0b) left bottom / 100% 5px no-repeat;padding-bottom:4px;display:inline-block}.section-lead{color:var(--ink-sub);margin:0 0 20px;font-size:.95rem}.cards{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:22px;display:grid}.card{border:1px solid var(--line);border-radius:var(--radius);background:#fff;flex-direction:column;transition:transform .18s,box-shadow .18s;display:flex;overflow:hidden;box-shadow:0 3px 10px #1f293712}.card:hover{transform:translateY(-3px);box-shadow:0 10px 22px #1f293721}.cover{aspect-ratio:16/9.5;background:linear-gradient(135deg, var(--cover-from), var(--cover-to));color:#fff;position:relative;overflow:hidden}.cover:before{content:"";background-image:radial-gradient(#ffffff38 2px,#0000 2.4px);background-size:20px 20px;position:absolute;inset:0}.cover-spine{writing-mode:vertical-rl;letter-spacing:.14em;color:#ffffffeb;background:#0003;justify-content:center;align-items:center;width:30px;font-size:.68rem;font-weight:700;display:flex;position:absolute;top:0;bottom:0;left:0;box-shadow:inset -2px 0 #ffffff40}.cover-body{flex-direction:column;padding:16px 16px 40px 46px;display:flex;position:absolute;inset:0}.cover-genre{background:#ffffff38;border:1px solid #ffffff8c;border-radius:999px;align-self:flex-start;margin:0 0 8px;padding:0 10px;font-size:.72rem;font-weight:700;line-height:1.7}.cover-title{letter-spacing:.02em;text-shadow:0 2px #0000002e;margin:0;font-size:clamp(1.45rem,2.4vw + 1rem,1.9rem);font-weight:900;line-height:1.3}.cover-author{color:#ffffffeb;margin:6px 0 0;font-size:.82rem}.cover-obi{background:var(--cover-band);color:#1f2937;justify-content:space-between;align-items:center;gap:8px;margin:0;padding:5px 12px 5px 46px;font-size:.8rem;font-weight:800;display:flex;position:absolute;bottom:0;left:0;right:0}.cover-publisher{white-space:nowrap;font-size:.7rem;font-weight:600}.rank{color:#fff;background:var(--accent);z-index:1;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-size:1.15rem;font-weight:900;display:flex;position:absolute;top:10px;right:10px;box-shadow:0 3px 8px #00000040}.rank--1{color:#713f12;background:linear-gradient(135deg,#f59e0b,#facc15)}.rank--2{color:#374151;background:linear-gradient(135deg,#9ca3af,#e5e7eb)}.rank--3{background:linear-gradient(135deg,#b45309,#d97706)}.rank--4{background:#0d9488}.rank--5{background:#6366f1}.card-body{flex-direction:column;flex:1;gap:10px;padding:16px 18px 18px;display:flex}.card .summary{flex:1;margin:0;font-size:.92rem}.card .free{background:#fffbeb;border:1.5px dashed #f59e0b;border-radius:10px;padding:10px 12px;font-size:.9rem}.free-chip{background:var(--pop-red);color:#fff;vertical-align:1px;border-radius:6px;margin-right:8px;padding:1px 9px;font-size:.78rem;font-weight:800;display:inline-block}.free-label{font-weight:700}.card .free .free-note{color:var(--ink-sub);margin-top:4px;font-size:.76rem;display:block}.card .stores{flex-wrap:wrap;gap:8px;margin:2px 0 0;padding:0;list-style:none;display:flex}.store{border:2px solid var(--line);color:var(--ink);background:#fff;border-radius:10px;align-items:center;gap:7px;padding:4px 12px;font-size:.85rem;font-weight:700;text-decoration:none;display:inline-flex}.store:before{content:"";background:var(--ink-sub);border-radius:50%;flex:none;width:10px;height:10px}.store small{color:var(--ink-sub);font-size:.7rem;font-weight:600}.store--booklive{border-color:#1d6fb8}.store--booklive:before{background:#1d6fb8}.store--renta{border-color:#e64b35}.store--renta:before{background:#e64b35}.store--dmm{border-color:#374151}.store--dmm:before{background:#e60012}a.store:hover{filter:brightness(.96);text-decoration:underline}.genre-list{flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;display:flex}.genre-list li{border:2px solid var(--accent);color:var(--accent-dark);background:#fff;border-radius:999px;padding:6px 18px;font-size:.92rem;font-weight:700;box-shadow:0 2px 5px #1f293714}.genre-list li:nth-child(5n+2){color:#1d4ed8;border-color:#2563eb}.genre-list li:nth-child(5n+3){color:#be123c;border-color:#e11d48}.genre-list li:nth-child(5n+4){color:#6d28d9;border-color:#7c3aed}.genre-list li:nth-child(5n+5){color:#b45309;border-color:#d97706}.doc{padding-bottom:44px}.doc h1{background:var(--accent-tint);border-left:8px solid var(--accent);border-radius:0 10px 10px 0;margin:30px 0 14px;padding:10px 16px;font-size:1.55rem;font-weight:900;line-height:1.4}.doc h2{border-bottom:3px solid #fde68a;margin:26px 0 6px;padding-bottom:3px;font-size:1.12rem;display:inline-block}.doc p,.doc li{font-size:.97rem}.doc table{border-collapse:collapse;margin:12px 0}.doc th,.doc td{border:1px solid var(--line);text-align:left;vertical-align:top;padding:8px 14px}.doc th{background:var(--accent-tint);white-space:nowrap}.note-box{border-radius:var(--radius);background:#fffbeb;border:1.5px dashed #f59e0b;padding:14px 18px;font-size:.92rem}.site-footer{color:#ccfbf1;background:linear-gradient(135deg,#134e4a,#0f766e);margin-top:0;padding:28px 0 36px;font-size:.88rem}.site-footer nav{flex-wrap:wrap;gap:16px;margin-bottom:10px;display:flex}.site-footer a{color:#f0fdfa}@media (width<=560px){.spine{width:30px;font-size:.7rem}.cover-body,.cover-obi{padding-left:42px}.band{padding:34px 0 28px}}@media (prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}html{scroll-behavior:auto}}
