:root{
  
  --font-sans:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Meiryo",system-ui,sans-serif;
  --font-serif:"Yu Mincho","Hiragino Mincho ProN","YuMincho",serif;
  --wrap:760px;

  
  --bg:#fdf6e3; --ink:#3a2a00; --line:#d4b896; --sub-ink:#8a7657;
  --accent:#e09200; --accent-2:#e53935; --heading:#5c3d1e; --gold:#e3b23c;
  --card-bg:#fffaf0; --card-border:#5c3d1e; --card-border-w:2.5px;
  --card-shadow:none;
  --chip-bg:#e09200; --chip-ink:#ffffff;
  --btn-bg:#f0a500; --btn-ink:#ffffff; --btn-shadow:none;
  --sign-font:var(--font-sans); --sign-weight:900; --sign-space:-.01em;
  --radius:4px; --section-gap:28px;

  
  --game-font-question: 2rem;      
  --game-font-cell:     1.8rem;    
  --game-font-slot:     1.5rem;    
  --game-tab-pad-y:     11px;      
  --game-tab-font:      1rem;      
  --game-pagetab-font:  0.95rem;   
  --game-title-mb:      4px;       
  --game-subtitle-mb:   20px;      
}


@media (min-width: 431px) {
  body.pg-top { zoom: 0.9; }
  body.pg-top .wrap { max-width: calc(var(--wrap) / 0.9); }
  body.pg-top .nl-desc { font-size: calc(14px / 0.9); }
  body.pg-top .nl-row-d { font-size: calc(13.5px / 0.9); }
  body.pg-top .nl-inline-d { font-size: calc(13px / 0.9); }
  body.pg-top .nl-inline-kikaku .nl-inline-d,
  body.pg-top .nl-inline-jiji .nl-inline-d { font-size: calc(11px / 0.9); }
  body.pg-top .nl-title { font-size: calc(16px / 0.9); }
  body.pg-top .nl-main .nl-title { font-size: calc(19px / 0.9); }
  body.pg-top .nl-inline-t { font-size: calc(15px / 0.9); }
  body.pg-top .nl-inline-kikaku .nl-inline-t,
  body.pg-top .nl-inline-jiji .nl-inline-t { font-size: calc(15px / 0.9); }
  body.pg-top .site-foot { font-size: calc(12.5px / 0.9); }
  body.pg-top #link-free { font-size: calc(12.5px / 0.9); }
  body.pg-top .shelf-mini { font-size: calc(12.5px / 0.9); }
}
@media (max-width: 430px) {
  body.pg-top { zoom: 0.8; }
  
  body.pg-top .nl-desc { font-size: calc(14px / 0.8); }
  body.pg-top .nl-row-d { font-size: calc(13.5px / 0.8); }
  body.pg-top .nl-inline-d { font-size: calc(13px / 0.8); }
  body.pg-top .nl-inline-kikaku .nl-inline-d,
  body.pg-top .nl-inline-jiji .nl-inline-d { font-size: calc(11px / 0.8); }
  body.pg-top .nl-title { font-size: calc(16px / 0.8); }
  body.pg-top .nl-main .nl-title { font-size: calc(19px / 0.8); }
  body.pg-top .nl-inline-t { font-size: calc(15px / 0.8); }
  body.pg-top .nl-inline-kikaku .nl-inline-t,
  body.pg-top .nl-inline-jiji .nl-inline-t { font-size: calc(15px / 0.8); }
  body.pg-top .site-foot { font-size: calc(12.5px / 0.8); }
  body.pg-top #link-free { font-size: calc(12.5px / 0.8); }
  body.pg-top .shelf-mini { font-size: calc(12.5px / 0.8); }
}


*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-sans);
  line-height:1.8;
  -webkit-text-size-adjust:100%;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
a{color:inherit}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}

ruby{ruby-align:center}
rt{font-size:.42em;line-height:1.15;color:var(--sub-ink);font-weight:500}


.skip{position:absolute;left:-9999px;top:auto}
.skip:focus{left:16px;top:12px;background:var(--card-bg);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:8px 12px;z-index:20}



.site-head{display:none;border-bottom:var(--card-border-w) solid var(--card-border);background:var(--bg)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding-top:14px;padding-bottom:14px}
.site-logo{font-weight:900;font-size:26px;letter-spacing:.02em;color:var(--heading);
  
  text-decoration:none}
.site-logo:hover{text-decoration:underline}


.banner{padding:clamp(28px,7vw,44px) 0 24px;position:relative;overflow:hidden}

@media (max-width: 479px) {
  .banner { padding: clamp(36px,9vw,52px) 0 32px; }
}
.banner .ogph{
  display:flex;align-items:center;
  justify-content:center;
  gap:clamp(18px,4.6vw,52px);
  position:relative;z-index:1;
}


.banner .ogph-board-css{
  --m9:clamp(26px,7vw,47px);
  display:grid;grid-template-columns:repeat(3,var(--m9));
  gap:clamp(4px,1vw,10px);flex:0 0 auto;
  background:var(--accent);padding:clamp(6px,1.5vw,12px);border-radius:8px;
}
.banner .ogph-board-css i{display:block;width:var(--m9);height:var(--m9);
  aspect-ratio:1/1;background:var(--bg);border-radius:6px;font-style:normal}
.banner .ogph-board-css i.ogph-c{background:var(--bg)}
.banner .ogph-board-css i:nth-child(2){background:#5b9bb5}
.banner .ogph-board-css i:nth-child(6){background:#4caf50}
.banner .ogph-board-css i:nth-child(8){background:var(--accent-2)}

.banner .ogph-board-svg{
  display:block;
  width:clamp(98px,25vw,185px);
  height:auto;
  flex:0 0 auto;
}
.banner .ogph-board-svg .mas-board{fill:var(--accent)}
.banner .ogph-board-svg .mas-fill{fill:var(--bg)}
.banner .ogph-board-svg .mas-mizu{fill:#5b9bb5}
.banner .ogph-board-svg .mas-midori{fill:#4caf50}
.banner .ogph-board-svg .mas-aka{fill:var(--accent-2)}

@media (min-width: 480px) { .banner .ogph-board-svg { display: none; } }
@media (max-width: 479px) { .banner .ogph-board-css { display: none; } }

.banner .ogph-text{flex:0 1 auto;min-width:0}
.banner .ogph-title{margin:0;
  font-family:var(--sign-font);font-weight:var(--sign-weight);letter-spacing:var(--sign-space);
  color:var(--heading);
  font-size:clamp(26px,7vw,54px);
  line-height:1.26}

.banner .ogph-title > span{display:inline}
.banner .ogph-rule{display:block;height:5px;
  margin:14px 0 10px;
  background:var(--accent);border-radius:2px}

.banner .ogph-copy{margin:0;
  font-weight:400;color:var(--sub-ink);
  font-size:clamp(19px,3.4vw,29px);line-height:1.6}


.sec{padding:var(--section-gap) 0 6px}
.sec-h{font-size:14px;font-weight:800;color:var(--heading);margin:0 0 14px;
  letter-spacing:.04em}
.sec-h small{font-weight:500;font-size:12px;color:var(--sub-ink);margin-left:8px}


.card{
  display:block;height:100%;
  background:var(--card-bg);
  border:var(--card-border-w) solid var(--card-border);
  border-radius:var(--radius);
  box-shadow:var(--card-shadow);
  padding:16px 16px 18px;
  text-decoration:none;color:var(--ink);
  transition:transform .12s ease;
}
a.card:hover{transform:translateY(-2px)}
a.card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.card .t{font-weight:800;font-size:16px;margin:0 0 6px;color:var(--accent)}
.card .d{margin:0;font-size:14px;color:var(--sub-ink)}
.card .chip{display:inline-block;margin-top:12px;font-size:11px;
  padding:3px 10px;border-radius:999px;background:var(--chip-bg);color:var(--chip-ink);
  font-weight:700}
.card.soon{opacity:.72;cursor:default}
.card.soon .chip{background:transparent;color:var(--sub-ink);border:1px solid var(--line)}


.new-grid{display:grid;gap:12px;grid-template-columns:1fr;max-width:720px;margin:0 auto}

.top-yougo{max-width:720px;margin:18px auto 1.9em;padding:0 16px;box-sizing:border-box;
  font-size:13px;line-height:1.9;
  color:var(--sub-ink);text-align:left}

@media(max-width:520px){.top-yougo{text-align:left;font-size:12.5px}}


.yougo-seg{display:inline-block}
.yougo-line{display:block}


.yougo-seg-wide{display:inline}
@media(min-width:521px){.yougo-seg-wide{display:inline-block}}


.yougo-line-wide{display:inline}
@media(min-width:521px){.yougo-line-wide{display:block}}

.na-game{order:1}
.na-game4{order:2}
.na-talk{order:3}
.na-print{order:4}
.na-works{order:5}
@media(min-width:760px){
  .new-grid{grid-template-columns:2fr 1fr;
    grid-template-areas:"game talk" "print talk" "works works"}
  .na-game{grid-area:game}.na-print{grid-area:print}
  
  .na-talk{grid-area:talk;align-self:start}.na-works{grid-area:works}
  
  .na-game{grid-column:1/-1}
  .na-game4{grid-column:1/-1}
  .na-game .mas9{margin-left:auto;margin-right:auto}
}
.nl-box{background:var(--card-bg);border:var(--card-border-w) solid var(--card-border);
  border-radius:var(--radius);box-shadow:var(--card-shadow);padding:16px 18px}
.nl-talk{display:flex;flex-direction:column}
.nl-talk[hidden]{display:none}
.nl-title{font-weight:800;font-size:16px;margin:0 0 6px;color:var(--accent);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;line-height:1.4}
.nl-title small{font-weight:500;font-size:.8em;color:inherit}
.nl-main .nl-title{font-size:19px}
.nl-desc{margin:0;font-size:14px;color:var(--sub-ink);line-height:1.7}

.sp-br { display: none; }
@media (max-width: 479px) { .sp-br { display: inline; } }
.nl-box .chip,.nl-box .soon-chip{margin-top:8px}

.nl-title .chip{margin-top:0}
.nl-row-t .chip{margin-top:0;margin-left:8px;vertical-align:middle}

.nl-box .chip{display:inline-block;font-size:11px;padding:3px 10px;border-radius:999px;
  background:var(--row-color,var(--chip-bg));color:var(--chip-ink);font-weight:700}
.soon-chip{display:inline-block;font-size:11px;padding:3px 10px;border-radius:999px;
  background:transparent;color:var(--sub-ink);border:1px solid var(--line);font-weight:700}


.nl-gamelink{display:block;text-decoration:none;color:inherit;border-radius:var(--radius)}
a.nl-gamelink:hover .nl-title{text-decoration:underline}
a.nl-gamelink:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.mas9{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0 0;max-width:200px}

.mas9 i{display:flex;align-items:center;justify-content:center;
  aspect-ratio:1/1;min-height:42px;background:var(--bg);
  border:1.5px solid var(--line);border-radius:calc(var(--radius) - 1px);
  font-style:normal;
  font-weight:800;font-size:34px;line-height:1;color:rgba(92,61,30,.5)}

.mas9 i.hit{background:#f6e6c8;border-color:var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:34px;line-height:1;font-style:normal;color:rgba(92,61,30,.5)}

.mas9 i.soft-a{background:rgba(227,178,60,.26)}
.mas9 i.soft-b{background:rgba(224,146,0,.22)}

.nl-takara{margin:10px auto 0;max-width:30em;font-size:13px;line-height:1.8;color:var(--sub-ink)}
.nl-takara-go{margin:10px auto 0;max-width:30em;font-size:13px;text-align:center}
.nl-takara-go a{font-weight:700;color:var(--accent);text-decoration:none}
.nl-takara-go a:hover{text-decoration:underline}


.nl-inline{display:block;margin:14px 0 0;padding:10px 12px;border:1px dashed var(--line);
  border-radius:var(--radius);border-left:5px solid #4caf50;
  text-decoration:none;color:var(--ink);background:var(--bg)}


@media (max-width: 479px) {
  .nl-inline-t { font-size: 14px; }
}
a.nl-inline:hover{border-color:var(--accent)}
.nl-inline-t{display:block;font-weight:800;font-size:15px;color:var(--heading)}
.nl-inline-d{display:block;font-size:13px;color:var(--sub-ink);margin-top:2px}
.nl-bunch .nl-inline-t{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px}
.nl-bunch .nl-inline-t .chip{display:inline-block;margin:0;white-space:nowrap;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:700;background:rgba(224,146,0,.22);color:var(--heading)}
.nl-bunch.nl-bunch-yomi{margin-top:10px}

.nl-inline-kikaku{margin-top:8px;padding:8px 10px;border-left-color:var(--gold);opacity:.9}
.nl-inline-kikaku .nl-inline-t{font-size:15px}
.nl-inline-kikaku .nl-inline-d{font-size:11px;line-height:1.5}

.nl-inline-jiji{margin-top:8px;padding:8px 10px;border-left-color:var(--accent);opacity:.92}
.nl-inline-jiji .nl-inline-t{font-size:15px}
.nl-inline-jiji .nl-inline-d{font-size:11px;line-height:1.5}






.nl-bunch{margin:24px 0 0;border:1px dashed var(--line);border-radius:var(--radius);
  border-left:5px solid var(--gold);background:var(--bg);overflow:hidden}
.nl-bunch .nl-inline{margin:0;border:none;border-radius:0;background:transparent}
.nl-bunch .nl-inline + .nl-inline{border-top:1px dashed var(--line)}
.nl-bunch a.nl-inline:hover{border-color:transparent}
.nl-bunch a.nl-inline:hover .nl-inline-t{text-decoration:underline}
.nl-inline-soon{opacity:.82}

.nl-bunch .nl-inline-today{background:#faf0d6}


.na-game4 .g4tana{display:flex;flex-direction:column;gap:6px;margin-top:12px;
  padding:8px 10px;border-radius:var(--radius);background:var(--bg);
  border:1px dashed var(--line)}
.na-game4 .g4tana-r{display:block;padding:6px 10px;font-size:14px;
  color:var(--sub-ink);border-left:3px solid var(--line);border-radius:2px}

.na-game4 .g4tana-today{background:#faeaec;padding-right:9px}

.na-game4{padding:10px 14px}
.na-game4 .nl-gamelink{display:grid;grid-template-columns:1fr auto;column-gap:18px;align-items:center}
.na-game4 .nl-title{grid-column:1;align-self:end;margin-bottom:2px}
.na-game4 .nl-title .soon-chip{margin-top:0}
.na-game4 .nl-desc{grid-column:1;align-self:start}

.na-game4 .mas9{grid-column:2;grid-row:1/span 2;margin:0;width:108px;max-width:none;gap:3px}
.na-game4 .mas9 i{display:flex;align-items:center;justify-content:center;
  aspect-ratio:1/1;min-height:0;background:var(--bg);
  border:1.5px solid var(--line);border-radius:calc(var(--radius) - 1px);
  font-style:normal;font-weight:600;font-size:15px;line-height:1;
  color:rgba(92,61,30,.5)}
.na-game4 .mas9 i.g4-hit{background:#f6e6c8;border-color:var(--gold);
  color:rgba(92,61,30,.5)}

@media(max-width:479px){
  .na-game .mas9{margin-left:auto;margin-right:auto}
  .na-game4 .nl-gamelink{display:block}
  .na-game4 .mas9{width:140px;max-width:140px;margin:12px auto 0;grid-column:auto;grid-row:auto}
  .na-game4 .mas9 i{font-size:19px}
}


.works-spines{display:flex;align-items:flex-end;gap:3px;height:42px;margin:12px 0 2px}
.works-spines i{display:block;width:7px;border-radius:1px;background:var(--heading)}
.works-spines i:nth-child(1){height:38px}
.works-spines i:nth-child(2){height:42px;background:var(--accent)}
.works-spines i:nth-child(3){height:36px}
.works-spines i:nth-child(4){height:40px}
.works-spines i:nth-child(5){height:39px}
.works-spines i:nth-child(6){height:41px;background:var(--gold)}
.works-spines i:nth-child(7){height:37px}
.works-spines i:nth-child(8){height:40px}


.nl-row{display:block;padding:10px 0 10px 12px;border-left:6px solid var(--row-color,var(--line));
  text-decoration:none;color:inherit}

.nl-box > .nl-row + .nl-row{margin-top:8px;border-top:1px solid var(--line);padding-top:12px}

.nl-row:has(.soon-chip){opacity:.82}
a.nl-row:hover .nl-row-t{text-decoration:underline}
.nl-row-t{display:block;font-weight:800;font-size:16px;color:var(--heading)}
.nl-row-t small{font-weight:500;font-size:.8em;color:inherit}
.nl-row-d{display:block;font-size:13.5px;color:var(--sub-ink);margin-top:2px;line-height:1.6}
.nl-row[data-cat="game"]{--row-color:var(--accent)}
.nl-row[data-cat="words"]{--row-color:#4caf50}
.nl-row[data-cat="print"]{--row-color:#5b9bb5}
.nl-row[data-cat="news"]{--row-color:#e0808f}
.nl-row[data-cat="works"]{--row-color:var(--heading)}
.nl-row[data-cat="kikaku"]{--row-color:var(--gold)}
.nl-row[data-cat="talk"]{--row-color:var(--accent-2)}

.nl-box[data-cat="game"]{--row-color:var(--accent)}
.nl-box[data-cat="talk"]{--row-color:var(--accent-2)}


.yt-slot{display:flex;gap:8px;margin:12px 0 4px}
.yt-slot i{flex:0 0 auto;width:40px;height:40px;font-style:normal;opacity:.5}
.yt-slot i:nth-child(1){background:var(--accent);border-radius:50%}
.yt-slot i:nth-child(2){background:var(--heading);border-radius:var(--radius)}
.yt-slot i:nth-child(3){background:var(--gold);border-radius:50%}


.crumbs{font-size:12px;color:var(--sub-ink);padding:16px 0 0}
.crumbs a{color:var(--sub-ink);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs .sep{margin:0 6px;opacity:.6}


.site-foot{margin-top:auto;border-top:1px solid var(--line);
  padding:22px 0 40px;font-size:12.5px;color:var(--sub-ink)}
.site-foot .wrap{display:flex;flex-direction:column;gap:5px}
#link-free:empty{display:none}
#link-free{text-align:center;font-size:12.5px}
.site-foot .foot-links a{color:var(--sub-ink);text-decoration:none;white-space:nowrap;display:inline-block;padding:6px 2px}
.site-foot .foot-links{text-align:center}
.site-foot .foot-links .name{white-space:nowrap}
.site-foot .foot-links a:hover{text-decoration:underline}

.site-foot .foot-links.fl-nav{margin:0}

.site-foot .foot-links.fl-nav + .foot-links.fl-nav{margin-top:5px}
body.pg-top .site-foot .foot-links{margin:0}
body.pg-top .site-foot .foot-links:first-of-type{margin-top:20px}
body.pg-top .site-foot .foot-links:last-of-type{margin-bottom:18px}

.site-foot .foot-links:not(.fl-nav){margin-bottom:15px}
body.pg-top .site-foot .foot-links + .foot-links{margin-top:7.5px}
.site-foot .foot-links .sep{margin:0 8px;opacity:.6}

.site-foot .foot-links .sep{display:none}
.site-foot .foot-links a:not(:last-of-type)::after{content:"｜";display:inline-block;opacity:.6;margin:0 8px;text-decoration:none}

.shelf-mini{display:flex;flex-direction:column;gap:4px;align-items:center;
  margin-top:2px;font-size:12.5px;line-height:1.7}
.shelf-mini a{color:var(--sub-ink);text-decoration:none}
.shelf-mini a:hover{text-decoration:underline}


.thin{padding:40px 0}
.thin h1{font-size:clamp(20px,5vw,26px);color:var(--heading);margin:0 0 12px}
.thin p{font-size:14px;color:var(--sub-ink);margin:0 0 20px}
.thin .back{display:inline-block;font-weight:700;font-size:13px;color:var(--accent);text-decoration:none}
.thin .back:hover{text-decoration:underline}


.works-intro{padding:18px 0 4px}

.works-title{font-size:clamp(20px,5vw,26px);color:var(--heading);margin:0 0 4px}
.works-title small{font-weight:500;font-size:.56em;color:inherit}
.works-sub{margin:0 0 8px;font-size:13px;color:var(--sub-ink);letter-spacing:.02em}
.intro-slot{margin:0;font-size:14px;color:var(--sub-ink)}

#pr-note{font-size:12px;color:var(--sub-ink)}
#pr-note:empty{display:none}
#pr-note:not(:empty){margin:8px 0 0;padding:8px 12px;border:1px dashed var(--line);
  border-radius:var(--radius)}

#exhibitions[hidden]{display:none}
.exh{margin:22px 0 6px;padding:16px;border:var(--card-border-w) solid var(--card-border);
  border-radius:var(--radius);background:var(--card-bg);box-shadow:var(--card-shadow)}
.exh-h{font-size:16px;color:var(--accent);margin:0 0 6px}
.exh-lead{margin:0 0 12px;font-size:13px;color:var(--sub-ink)}

.filters{margin:18px 0 6px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--card-bg);overflow:hidden}
.filters>summary{cursor:pointer;list-style:none;padding:10px 14px;font-size:13px;
  font-weight:700;color:var(--sub-ink)}
.filters>summary::-webkit-details-marker{display:none}
.filters>summary::after{content:"⌄";margin-left:8px;color:var(--sub-ink)}
.filters[open]>summary::after{content:"⌃"}
.filters .filter-body{padding:4px 14px 14px}
.filters .filter-lab{margin:6px 0 8px;font-size:12px;color:var(--sub-ink)}
.filters .chips{display:flex;flex-wrap:wrap;gap:8px}
.fchip{appearance:none;font-family:inherit;cursor:pointer;border:1px solid var(--line);
  background:var(--bg);color:var(--sub-ink);border-radius:999px;padding:5px 12px;
  font-size:12px;font-weight:700}
.fchip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.fchip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.room{margin:24px 0 0}
.room-h{font-size:16px;color:var(--accent);margin:0 0 4px}
.room-h small{display:block;font-weight:500;font-size:12px;color:var(--sub-ink);margin-top:2px}
.shelf-group{margin:14px 0 0}
.group-h{font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--sub-ink);
  margin:0 0 8px;padding-left:2px;border-left:3px solid var(--gold)}
.room-note{margin:14px 0 0;font-size:12px;color:var(--sub-ink)}

.spine-grid{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:520px){.spine-grid{grid-template-columns:1fr 1fr}}
@media(min-width:820px){.spine-grid{grid-template-columns:1fr 1fr 1fr}}


.spine[data-kind="漫画"]{--spine:var(--accent)}
.spine[data-kind="まんが"]{--spine:var(--accent)}     
.spine[data-kind="アニメ"]{--spine:#e0808f}   
.spine[data-kind="邦画"]{--spine:var(--gold)}         
.spine[data-kind="映画"]{--spine:var(--heading)}
.spine[data-kind="ドラマ"]{--spine:var(--accent-2)}
.spine[data-kind="絵本"]{--spine:#4caf50}
.spine[data-kind="小説"]{--spine:#4caf50}    
.spine[data-kind="その他"]{--spine:var(--sub-ink)}
.spine{--spine:var(--sub-ink)}

.spine{background:var(--card-bg);border:var(--card-border-w) solid var(--card-border);
  border-radius:var(--radius);box-shadow:var(--card-shadow);overflow:hidden}
.spine-face{cursor:pointer;list-style:none;display:flex;align-items:stretch;gap:0;padding:0}
.spine-face::-webkit-details-marker{display:none}
.spine-face:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.spine-band{flex:0 0 8px;background:var(--spine);align-self:stretch}
.spine-body{flex:1;padding:12px 14px;min-width:0}
.spine-title{display:block;font-weight:800;font-size:15px;color:var(--ink);line-height:1.5}
.spine-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;align-items:center}
.spine .badge{font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px;
  background:var(--spine);color:#fff}
.spine .chip-mini{font-size:11px;color:var(--sub-ink);padding:2px 8px;
  border:1px solid var(--line);border-radius:999px}
.spine .age-mini{font-size:11px;color:var(--sub-ink);padding:2px 8px;
  border:1px dashed var(--line);border-radius:999px}

.spine .oshi-mini{font-size:11px;color:var(--sub-ink);padding:2px 8px;
  border:1px dashed var(--line);border-radius:999px}
.spine-face::after{content:"＋";margin:12px 14px 0 0;color:var(--sub-ink);
  font-weight:700;align-self:flex-start}
.spine[open] .spine-face::after{content:"−"}

.spine-tie{display:block;margin-top:8px;font-size:12px;color:var(--sub-ink);line-height:1.5}
.spine-tie::before{content:"つながり：";color:var(--accent);font-weight:700}

.spine-detail{padding:2px 14px 14px 22px;border-top:1px solid var(--line)}
.facts{margin:12px 0 0}
.facts>div{display:flex;gap:10px;margin:0 0 6px;font-size:13px}
.facts dt{flex:0 0 5.5em;margin:0;color:var(--sub-ink);font-weight:700}
.facts dd{margin:0;color:var(--ink)}
.find{margin:12px 0 0;padding-top:10px;border-top:1px dashed var(--line)}
.find-h{margin:0 0 8px;font-size:12px;font-weight:700;color:var(--sub-ink)}
.find-link{display:inline-block;font-size:13px;font-weight:700;color:var(--btn-ink);
  background:var(--btn-bg);box-shadow:var(--btn-shadow);border-radius:999px;
  padding:6px 14px;text-decoration:none}
.find-link .pr-tag{margin-left:8px;font-size:10px;font-weight:700;opacity:.85}
.find-ph{margin:0;font-size:12px;color:var(--sub-ink)}


.yomitai-wrap{margin:12px 0 0;padding-top:10px;border-top:1px dashed var(--line)}
.yomitai{appearance:none;font-family:inherit;cursor:pointer;border:1.5px solid var(--accent);
  background:var(--card-bg);color:var(--accent);border-radius:999px;padding:6px 16px;
  font-size:13px;font-weight:700;
  white-space:nowrap;flex-shrink:0}
.yomitai[aria-pressed="true"]{background:var(--accent);color:#fff}
.yomitai:focus-visible{outline:2px solid var(--accent);outline-offset:2px}



.spine-actions{display:flex;flex-wrap:nowrap;gap:7px;align-items:center;
  margin:12px 0 0;padding-top:10px;padding-right:8px;border-top:1px dashed var(--line)}
.spine-actions .yomitai{padding:4px 10px;font-size:11.5px}
.spine-actions .find-link-mini{padding:4px 10px;font-size:11.5px}
.find-link-mini{display:inline-block;font-size:12.5px;font-weight:700;color:var(--btn-ink);
  background:var(--btn-bg);box-shadow:var(--btn-shadow);border-radius:999px;
  padding:5px 12px;text-decoration:none;white-space:nowrap}
.find-link-mini:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.find-link-mini .pr-tag{margin-left:6px;font-size:10px;font-weight:700;opacity:.85}


.pr-foot-note{font-size:11.5px;color:var(--sub-ink);text-align:center;margin:0 0 10px;line-height:1.6}


.intro-contrib-link{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;
  text-underline-offset:2px}
.intro-contrib-link:hover{color:var(--heading)}





.pop{margin:12px 0 0;padding:10px 12px;border:1px dashed var(--line);
  border-radius:var(--radius);background:var(--bg)}
.pop-h{display:block;font-size:11px;font-weight:800;color:var(--sub-ink)}
.pop-ph{margin:4px 0 0;font-size:12.5px;color:var(--sub-ink);font-style:italic}

.spine-pop-hint{display:block;margin-top:8px;font-size:11.5px;color:var(--sub-ink)}


.contrib{margin:26px 0 0;padding:16px 16px 16px 18px;border:var(--card-border-w) solid var(--card-border);
  border-left:6px solid var(--gold);border-radius:var(--radius);background:var(--card-bg)}
.contrib-h{margin:0;font-size:16px;font-weight:800;color:var(--heading)}
.contrib-d{margin:8px 0 0;font-size:13px;color:var(--sub-ink)}
.contrib .soon-chip{margin-top:10px}

.empty-note{margin:20px 0;font-size:13px;color:var(--sub-ink)}
.works-back{margin:26px 0 0}
.works-back .back{display:inline-block;font-weight:700;font-size:13px;
  color:var(--accent);text-decoration:none}
.works-back .back:hover{text-decoration:underline}


.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(10px);
  max-width:88%;background:var(--heading);color:#fff;border-radius:8px;
  padding:11px 16px;font-size:13px;line-height:1.6;box-shadow:0 6px 20px rgba(60,40,10,.28);
  opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;z-index:40}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}