html[data-design="archive"] {
  --night:#ece3d2; --panel:#f6efe2; --bezel:#c9b99c; --rule:#d9ccb3; --dot:transparent;
  --amber:#2c4a78; --green:#3d6b4a; --red:#a8372b; --ink:#2a2118; --sub:#6a5a44; --sign:#1d160f;
  --paper:#f4ecdc; --paper-ink:#2a2118; --stamp:#a8372b;
  --serif:"Fraunces","Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;
  --led:"IBM Plex Mono",ui-monospace,monospace;
  --heavy:"Zen Kaku Gothic Antique","Hiragino Sans",sans-serif;
  --indigo:#2c4a78;
  --series:#7a6a52;
  color-scheme:light;
}
html[data-design="archive"] [data-series="m"] { --series:#8e3a2c; }
html[data-design="archive"] [data-series="sv"] { --series:#2f506e; }
html[data-design="archive"] [data-series="s"] { --series:#55663a; }
html[data-design="archive"] [data-series="sm"] { --series:#9a7330; }
html[data-design="archive"] [data-series="xy"] { --series:#5a5048; }
html[data-design="archive"] [data-series="bw"] { --series:#2b2622; }
html[data-design="archive"] body { background:#ece3d2 url(img/kari/wall.svg) repeat; color:var(--ink); }
html[data-design="archive"] a { color:var(--indigo); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
html[data-design="archive"] a:hover { color:var(--red); }
html[data-design="archive"] .ekimei { border-bottom:3px double var(--ink); margin-bottom:0; padding:1rem var(--gut) .7rem; }
html[data-design="archive"] .ekimei::after { display:none; }
html[data-design="archive"] .ekimei .side { font:500 .7rem/1.4 var(--led); letter-spacing:.08em; color:var(--ink); text-decoration:none; }
html[data-design="archive"] .ekimei .here { text-decoration:none; }
html[data-design="archive"] .ekimei .here b { font:900 1.5rem/1 var(--heavy); color:var(--sign); letter-spacing:.06em; }
html[data-design="archive"] .ekimei .here span { font:300 .62rem var(--serif); font-style:italic; letter-spacing:.3em; color:var(--sub); }
html[data-design="archive"] h1, html[data-design="archive"] h2 { font-family:var(--serif); font-weight:600; color:var(--sign); }
html[data-design="archive"] h1 { font-size:clamp(1.8rem, 5vw, 3rem); }
html[data-design="archive"] h2 { font-size:clamp(1.2rem, 2.8vw, 1.7rem); }
html[data-design="archive"] .sec { border-bottom:1px solid var(--ink); padding-bottom:.5rem; }
html[data-design="archive"] .sec .count { font:500 .72rem var(--led); color:var(--sub); }
html[data-design="archive"] .lead, html[data-design="archive"] .note { color:var(--sub); }
html[data-design="archive"] .crumb { font-family:var(--led); font-size:.72rem; }
html[data-design="archive"] .rows { border-bottom:1px solid var(--ink); background:repeating-linear-gradient(180deg, transparent 0 55px, rgba(44,74,120,.12) 55px 56px); }
html[data-design="archive"] .row { border-top:1px solid var(--rule); color:var(--ink); text-decoration:none; }
html[data-design="archive"] a.row:hover { background:rgba(246,239,226,.8); }
html[data-design="archive"] .row .name { color:var(--sign); font-family:var(--serif); font-weight:600; }
html[data-design="archive"] .row .meta { color:var(--sub); }
html[data-design="archive"] .row .cond { font-family:var(--led); color:var(--green); }
html[data-design="archive"] .row .num { font-family:var(--led); color:var(--sub); }
html[data-design="archive"] .colhead { font-family:var(--led); border-bottom:1px solid var(--ink); }
html[data-design="archive"] .board { background:var(--paper) url(img/kari/index.svg) top/100% auto no-repeat; border:1px solid var(--bezel); border-radius:0; padding:.6rem .9rem .8rem; box-shadow:0 18px 30px -24px rgba(42,33,24,.6); }
html[data-design="archive"] .board-head { color:var(--sub); font-family:var(--led); padding-top:.3rem; }
html[data-design="archive"] .board-head .clock { color:var(--red); font-family:var(--led); }
html[data-design="archive"] .screen { background:transparent; padding:0; }
html[data-design="archive"] .screen .row { border-top:1px solid var(--rule); }
html[data-design="archive"] .daybar { border-bottom:1px solid var(--ink); }
html[data-design="archive"] .daybar .d { font:600 1.7rem/1 var(--serif); color:var(--red); border:2px solid var(--red); border-radius:4px; padding:.12rem .4rem; transform:rotate(-2deg); }
html[data-design="archive"] .daybar.today .d { animation:none; background:rgba(168,55,43,.08); }
html[data-design="archive"] .today-tag { font-family:var(--led); color:var(--red); }
html[data-design="archive"] .badge { font-family:var(--led); font-size:.66rem; border:1px solid currentColor; padding:0 .3rem; border-radius:2px; }
html[data-design="archive"] .badge.store { color:var(--indigo); }
html[data-design="archive"] .searchbar form { border:1px solid var(--ink); background:var(--panel); height:58px; box-shadow:inset 0 2px 0 rgba(42,33,24,.06); }
html[data-design="archive"] .searchbar form:focus-within { border-color:var(--indigo); }
html[data-design="archive"] .searchbar input { color:var(--sign); font:500 1.3rem var(--led); }
html[data-design="archive"] .searchbar input::placeholder, html[data-design="archive"] .hsearch input::placeholder { color:#6e5e48; opacity:1; }
html[data-design="archive"] .searchbar button { background:var(--indigo); color:#f6efe2; font:900 .95rem var(--heavy); letter-spacing:.12em; }
html[data-design="archive"] .hints span { font-family:var(--led); border-color:var(--bezel); background:var(--panel); }
html[data-design="archive"] .more { border-color:var(--ink); font-family:var(--led); text-decoration:none; background:var(--panel); }
html[data-design="archive"] .stage { display:block; position:relative; overflow:hidden; height:min(84vh, 760px); min-height:540px; perspective:1500px; perspective-origin:30% 40%;
  background:linear-gradient(180deg, rgba(42,33,24,.12), transparent 30%), url(img/kari/wall.svg); border-bottom:3px double var(--ink); }
html[data-design="archive"] .stage-copy { position:absolute; z-index:3; right:var(--gut); top:1.6rem; max-width:min(92%, 30rem); text-align:right; }
html[data-design="archive"] .stage-kicker { margin:0 0 .5rem; font:500 .66rem var(--led); letter-spacing:.14em; color:var(--sub); }
html[data-design="archive"] .stage-title { margin:0; font:600 clamp(2.2rem, 7vw, 5rem)/1.05 var(--serif); color:var(--sign); }
html[data-design="archive"] .stage-title span { display:block; }
html[data-design="archive"] .stage-title span + span { font-style:italic; color:var(--indigo); }
html[data-design="archive"] .stage-sets { list-style:none; margin:0; padding:0 0 0 calc(var(--gut) + 1rem); position:absolute; left:0; bottom:74px; display:flex; align-items:flex-end; gap:3px;
  transform-style:preserve-3d; transform:rotateY(var(--shelf, 16deg)); transform-origin:0 100%; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
html[data-design="archive"] .stage::after { content:""; position:absolute; left:0; right:0; bottom:36px; height:44px; background:url(img/kari/wood.svg) center/cover; box-shadow:0 14px 18px -8px rgba(42,33,24,.55); z-index:1; }
html[data-design="archive"] .stage-sets li { position:relative; z-index:2; height:calc(300px + var(--j, 2) * 14px); width:calc(54px + (var(--n, 100) * .14px)); transform-style:preserve-3d; transition:transform .35s cubic-bezier(.2,.7,.2,1); }
html[data-design="archive"] .stage-sets a { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; padding:12px 0 14px; text-decoration:none; color:#f2e9d6;
  background-color:var(--series); background-image:url(img/kari/cloth.svg), linear-gradient(90deg, rgba(0,0,0,.25), rgba(255,255,255,.1) 30%, rgba(0,0,0,.18)); background-blend-mode:multiply, normal;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.25); border-radius:2px 2px 0 0; }
html[data-design="archive"] .stage-sets li::before { content:""; position:absolute; top:0; bottom:0; left:100%; width:190px; transform-origin:0 50%; transform:rotateY(90deg);
  background-color:var(--series); background-image:url(img/kari/cloth.svg); background-blend-mode:multiply; filter:brightness(.72); }
html[data-design="archive"] .stage-sets li:hover, html[data-design="archive"] .stage-sets li:focus-within { transform:translateZ(46px) translateY(-14px); }
html[data-design="archive"] .ss-code { font:600 1.05rem/1 var(--serif); letter-spacing:.02em; padding:0 4px; text-align:center; border-bottom:1px solid rgba(242,233,214,.5); padding-bottom:8px; width:100%; }
html[data-design="archive"] .ss-name { writing-mode:vertical-rl; font:900 1rem/1.15 var(--heavy); letter-spacing:.12em; margin:12px 0 auto; max-height:70%; overflow:hidden; }
html[data-design="archive"] .ss-date { font:500 .58rem var(--led); letter-spacing:.04em; opacity:.85; }
html[data-design="archive"] .ss-count { display:none; }
html[data-design="archive"] .stage-all { display:inline-flex; align-items:center; position:absolute; z-index:3; right:var(--gut); bottom:4px; min-height:28px; padding:0 .8rem;
  font:500 .74rem var(--led); letter-spacing:.08em; color:var(--sign); text-decoration:none; background:var(--panel); border:1px solid var(--ink); }
html[data-design="archive"] .stage-all::after { content:"→"; margin-left:.5rem; }
html[data-design="archive"] .stage-all:hover, html[data-design="archive"] .stage-all:focus-visible { background:var(--sign); color:var(--panel); }
html[data-design="archive"] .top-newsets { display:none; }
html[data-design="archive"] .stage-cards { list-style:none; margin:0; padding:1.4rem var(--gut) .6rem; display:flex; gap:.5rem; overflow-x:auto; scroll-snap-type:x mandatory; perspective:900px; }
html[data-design="archive"] .stage-cards li { flex:0 0 min(62vw, 230px); scroll-snap-align:start; }
html[data-design="archive"] .stage-cards a { display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto 1fr; gap:.15rem .6rem; aspect-ratio:5/3; padding:.9rem 1rem; text-decoration:none; color:var(--ink);
  background:url(img/kari/index.svg) center/cover; box-shadow:0 14px 20px -16px rgba(42,33,24,.65); transform:rotateX(14deg); transform-origin:50% 100%; transition:transform .3s cubic-bezier(.2,.7,.2,1); }
html[data-design="archive"] .stage-cards a:hover, html[data-design="archive"] .stage-cards a:focus-visible { transform:rotateX(0deg) translateY(-10px); }
html[data-design="archive"] .sc-no { grid-column:1 / -1; font:500 .7rem var(--led); color:var(--sub); letter-spacing:.06em; }
html[data-design="archive"] .sc-rar { grid-row:2 / span 2; align-self:start; font:600 .74rem var(--led); color:var(--red); border:1.5px solid var(--red); border-radius:50%; width:46px; height:46px; display:grid; place-items:center; transform:rotate(-10deg); }
html[data-design="archive"] .sc-name { font:600 1rem/1.35 var(--serif); }
@media (max-width:719px) {
  html[data-design="archive"] .stage { height:78vh; min-height:520px; perspective-origin:20% 40%; }
  html[data-design="archive"] .stage-copy { left:var(--gut); right:var(--gut); text-align:left; }
  html[data-design="archive"] .stage-sets { --shelf:10deg; gap:2px; padding-left:.6rem; }
  html[data-design="archive"] .stage-sets li { height:calc(220px + var(--j, 2) * 10px); width:calc(34px + (var(--n, 100) * .06px)); }
  html[data-design="archive"] .stage-sets li::before { width:120px; }
  html[data-design="archive"] .ss-code { font-size:.76rem; }
  html[data-design="archive"] .ss-name { font-size:.78rem; }
  html[data-design="archive"] .ss-date { display:none; }
}
html[data-design="archive"] .rosen { padding-left:0; background:none; }
html[data-design="archive"] .rosen::before, html[data-design="archive"] .rosen .row::before { display:none; }
html[data-design="archive"] main .yr { display:inline-flex; margin:1.6rem 0 0 var(--gut); padding:.4rem 1.2rem .3rem; font:600 2rem/1 var(--serif); color:var(--sign); background:var(--paper); border:1px solid var(--bezel); border-bottom:0; border-radius:6px 6px 0 0; }
html[data-design="archive"] main .yr span { font:500 .66rem var(--led); color:var(--sub); }
html[data-design="archive"] main .years a { font-family:var(--led); }
html[data-design="archive"] .setrow { margin:0 var(--gut); background:var(--paper); border:1px solid var(--bezel); border-top:0; border-left:5px solid var(--series); }
html[data-design="archive"] .setrow:first-of-type { border-top:1px solid var(--bezel); }
html[data-design="archive"] .setrow:hover { background:#fffaf0; }
html[data-design="archive"] .setrow .code { font:500 .95rem var(--led); color:var(--indigo); }
html[data-design="archive"] .setrow .name { font-family:var(--serif); font-weight:600; color:var(--sign); }
html[data-design="archive"] .setrow .date { font-family:var(--led); color:var(--red); }
html[data-design="archive"] .setrow .cards { font-family:var(--led); }
html[data-design="archive"] .cardrow .no { font:500 1rem var(--led); color:var(--indigo); }
html[data-design="archive"] .cardrow .rar { font-family:var(--led); color:var(--red); }
html[data-design="archive"] .obj { position:relative; display:grid; padding:2rem var(--gut) 2.2rem; perspective:1200px; }
html[data-design="archive"] .card-art { position:relative; z-index:2; display:grid; grid-template-rows:auto 1fr auto auto; width:min(58vw, 250px); aspect-ratio:63/88; padding:14px; margin:0 0 -90px .6rem; color:#f3ead7;
  background-color:var(--series); background-image:url(img/kari/cloth.svg); background-blend-mode:multiply; border-radius:8px;
  box-shadow:0 0 0 7px rgba(255,255,255,.35), 0 0 0 8px rgba(42,33,24,.18), 0 30px 40px -24px rgba(42,33,24,.7);
  transform:rotate(-4deg) translate3d(var(--px, 0px), var(--py, 0px), 40px); transition:transform .3s ease-out; }
html[data-design="archive"] .card-art::after { content:""; position:absolute; inset:-7px; border-radius:10px; pointer-events:none; background:linear-gradient(120deg, rgba(255,255,255,.35), transparent 25%, transparent 70%, rgba(255,255,255,.2)); }
html[data-design="archive"] .card-art::before { content:""; position:absolute; z-index:3; top:-22px; right:30px; width:26px; height:70px; border:3px solid #8d8a84; border-radius:13px 13px 13px 13px; border-bottom-color:transparent; box-shadow:1px 2px 2px rgba(0,0,0,.25); }
html[data-design="archive"] .ca-rar { justify-self:end; font:600 .8rem var(--led); border:1.5px solid currentColor; border-radius:50%; width:48px; height:48px; display:grid; place-items:center; transform:rotate(8deg); }
html[data-design="archive"] .ca-code { font:500 .9rem var(--led); letter-spacing:.08em; align-self:end; }
html[data-design="archive"] .ca-no { font:600 clamp(3.6rem, 16vw, 5.4rem)/.9 var(--serif); }
html[data-design="archive"] .ca-name { writing-mode:horizontal-tb; font:900 .98rem/1.3 var(--heavy); margin-top:.3rem; }
html[data-design="archive"] .ca-set { font:500 .6rem var(--led); opacity:.85; }
html[data-design="archive"] .idcard { margin:0; transform:translate3d(calc(var(--px, 0px) * -.4), calc(var(--py, 0px) * -.4), 0); background:var(--paper) url(img/kari/index.svg) center/cover; color:var(--ink); padding:110px 1.3rem 1.4rem 5.6rem; box-shadow:0 22px 34px -26px rgba(42,33,24,.75); border-radius:2px; transition:transform .3s ease-out; }
html[data-design="archive"] .idcard::before, html[data-design="archive"] .idcard::after { display:none; }
html[data-design="archive"] .ticket-head { font:500 .7rem var(--led); color:var(--sub); }
html[data-design="archive"] .ticket-route b { font:600 2rem var(--serif); color:var(--indigo); }
html[data-design="archive"] .idnum { font-family:var(--serif) !important; }
html[data-design="archive"] .idcard h1 { color:var(--sign); font-size:clamp(1.6rem, 4.6vw, 2.4rem); }
html[data-design="archive"] .chip { font-family:var(--led); font-size:.64rem; border-color:var(--bezel); }
html[data-design="archive"] .stamp { border-color:var(--red); color:var(--red); font-family:var(--led); }
html[data-design="archive"] .prices { background:var(--paper); border:1px solid var(--bezel); }
html[data-design="archive"] .price + .price { border-top:1px solid var(--rule); }
html[data-design="archive"] .price .cond { font-family:var(--led); color:var(--sub); }
html[data-design="archive"] .price .yen { font:600 2.1rem/1 var(--serif); color:var(--sign); }
html[data-design="archive"] .price .yen small { font:500 .8rem var(--led); }
html[data-design="archive"] .price .basis { font-family:var(--led); color:var(--green); }
html[data-design="archive"] .links a { border-color:var(--ink); background:var(--panel); text-decoration:none; font-family:var(--serif); font-weight:600; }
html[data-design="archive"] .nb { border-color:var(--bezel); background:var(--paper); text-decoration:none; }
html[data-design="archive"] .nb .nbnum { font:600 1.4rem var(--serif); color:var(--indigo); }
html[data-design="archive"] footer { border-top:3px double var(--ink); color:var(--sub); }
@media (min-width:1100px) {
  html[data-design="archive"] main { max-width:74rem; }
  html[data-design="archive"] .obj { grid-template-columns:300px minmax(0, 1fr); align-items:start; padding:3rem 3rem 2.6rem; }
  html[data-design="archive"] .card-art { width:290px; margin:0 -60px 0 0; grid-column:1; grid-row:1; }
  html[data-design="archive"] .idcard { grid-column:2; grid-row:1; margin-top:3rem; padding:2.6rem 2rem 2rem 8rem; }
  html[data-design="archive"] .stage-cards { overflow:visible; display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-design="archive"] .stage-sets, html[data-design="archive"] .stage-sets li, html[data-design="archive"] .stage-cards a,
  html[data-design="archive"] .card-art, html[data-design="archive"] .idcard { transition:none; }
}
@media (max-width:719px) {
  html[data-design="archive"] .idcard { padding:110px 1rem 1.2rem 3.6rem; }
  html[data-design="archive"] .ticket-head { flex-wrap:wrap; }
}
html[data-design="archive"] .hsearch { display:flex; margin:.7rem var(--gut) 0; height:46px; border:1px solid var(--ink); background:var(--panel); }
html[data-design="archive"] .hsearch input { flex:1 1 auto; min-width:0; border:0; background:transparent; padding:0 .8rem; font:500 1rem var(--led); color:var(--sign); }
html[data-design="archive"] .hsearch input:focus { outline:none; }
html[data-design="archive"] .hsearch:focus-within { border-color:var(--indigo); }
html[data-design="archive"] .hsearch button { border:0; background:var(--indigo); color:#f6efe2; padding:0 1.1rem; font:900 .85rem var(--heavy); letter-spacing:.1em; cursor:pointer; }
html[data-design="archive"] .lotstrip { display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:.8rem; margin:.7rem var(--gut) 0; padding:.65rem .9rem; text-decoration:none; color:var(--ink);
  background:var(--paper) url(img/kari/index.svg) center/cover; border:1px solid var(--bezel); box-shadow:0 10px 16px -12px rgba(42,33,24,.6); }
html[data-design="archive"] .ls-k { grid-column:1 / -1; font:500 .66rem var(--led); color:var(--sub); letter-spacing:.08em; }
html[data-design="archive"] .ls-n { font:600 1.7rem/1 var(--serif); color:var(--red); }
html[data-design="archive"] .ls-next { align-self:center; font:600 .9rem/1.4 var(--serif); color:var(--sign); }
html[data-design="archive"] .stage { margin-top:.7rem; }
html[data-design="archive"] .rel-cards { flex-direction:row; gap:.5rem; overflow-x:auto; padding:.6rem var(--gut) .4rem; border:0; scroll-snap-type:x mandatory; }
html[data-design="archive"] .rel-cards li { flex:0 0 min(60vw, 210px); scroll-snap-align:start; }
html[data-design="archive"] .rel-cards a { display:grid; grid-template-columns:auto 1fr; gap:.1rem .5rem; aspect-ratio:5/3; padding:.7rem .8rem; border:0; text-decoration:none; background:url(img/kari/index.svg) center/cover; box-shadow:0 12px 18px -14px rgba(42,33,24,.6); }
html[data-design="archive"] .rel-cards .rc-rar { grid-row:1 / span 2; width:40px; height:40px; display:grid; place-items:center; border:1.5px solid var(--red); color:var(--red); border-radius:50%; font:500 .64rem var(--led); transform:rotate(-8deg); }
html[data-design="archive"] .rel-cards .rc-no { color:var(--indigo); font:500 .7rem var(--led); }
html[data-design="archive"] .rel-cards .rc-name { grid-column:2; font:600 .92rem/1.3 var(--serif); color:var(--sign); }
html[data-design="archive"] .rarfilter button { border:1px solid var(--bezel); background:var(--panel); color:var(--ink); font-family:var(--led); border-radius:5px 5px 0 0; }
html[data-design="archive"] .rarfilter button[aria-pressed="true"] { background:var(--indigo); color:#f6efe2; border-color:var(--indigo); }
html[data-design="archive"] .colhead { display:none; }
html[data-design="archive"] main .yrgroup { display:block; margin:1.4rem 0 0; }
html[data-design="archive"] main .yrgroup .yr { display:flex; margin:0 var(--gut); padding:.3rem .9rem .2rem; border:1px solid var(--bezel); border-bottom:0; border-radius:6px 6px 0 0; background:var(--paper); width:max-content; }
html[data-design="archive"] main .yrsets { display:flex; align-items:flex-end; gap:3px; overflow-x:auto; padding:1.2rem var(--gut) 22px; min-height:270px; scroll-snap-type:x proximity; border-top:1px solid var(--bezel);
  background:url(img/kari/wood.svg) left bottom / 100% 22px no-repeat, linear-gradient(180deg, rgba(42,33,24,.12), transparent 40%), url(img/kari/wall.svg);
  background-attachment:local, local, local; }
html[data-design="archive"] main .yrsets .setrow { flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:0; margin:0; padding:10px 0 12px; min-height:0;
  width:calc(40px + var(--n, 100) * .06px); height:calc(196px + (var(--n, 100) * .03px)); max-height:236px; border:0; border-radius:2px 2px 0 0; color:#f2e9d6; text-decoration:none; scroll-snap-align:start;
  background-color:var(--series); background-image:url(img/kari/cloth.svg), linear-gradient(90deg, rgba(0,0,0,.25), rgba(255,255,255,.1) 30%, rgba(0,0,0,.18)); background-blend-mode:multiply, normal;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.25); transition:transform .25s cubic-bezier(.2,.7,.2,1); }
html[data-design="archive"] main .yrsets .setrow:hover, html[data-design="archive"] main .yrsets .setrow:focus-visible { transform:translateY(-12px); background-color:var(--series); }
html[data-design="archive"] main .yrsets .setrow .code { font:600 .78rem/1 var(--serif); color:#f2e9d6; width:auto; padding-bottom:6px; border-bottom:1px solid rgba(242,233,214,.45); }
html[data-design="archive"] main .yrsets .setrow .name { writing-mode:vertical-rl; flex:1 1 auto; margin:8px 0 6px; font:900 .82rem/1.15 var(--heavy); letter-spacing:.1em; color:#f2e9d6; overflow:hidden; }
html[data-design="archive"] main .yrsets .setrow .cards { display:none; }
html[data-design="archive"] main .yrsets .setrow .date { font:500 .5rem var(--led); color:#f2e9d6; opacity:.85; writing-mode:vertical-rl; }
html[data-design="archive"] .bookfx { position:fixed; inset:0; z-index:60; display:grid; place-items:center; background:rgba(42,33,24,.45); perspective:1600px; }
html[data-design="archive"] .bookfx[hidden] { display:none; }
html[data-design="archive"] .book { position:relative; width:min(86vw, 560px); aspect-ratio:3/2; transform-style:preserve-3d; transition:transform .7s cubic-bezier(.2,.75,.25,1); }
html[data-design="archive"] .book .pg { position:absolute; top:0; bottom:0; width:50%; background:var(--paper) url(img/kari/index.svg) center/cover; box-shadow:0 30px 60px -20px rgba(0,0,0,.6); }
html[data-design="archive"] .book .pg.l { left:0; border-radius:4px 0 0 4px; padding:1.2rem; display:flex; flex-direction:column; gap:.4rem; }
html[data-design="archive"] .book .pg.r { right:0; border-radius:0 4px 4px 0; padding:1.2rem; display:flex; flex-direction:column; gap:.5rem; justify-content:center; }
html[data-design="archive"] .book .cover { position:absolute; top:0; bottom:0; right:0; width:50%; transform-origin:0 50%; transform-style:preserve-3d; transition:transform .9s cubic-bezier(.2,.75,.25,1) .35s; }
html[data-design="archive"] .book .cover > div { position:absolute; inset:0; backface-visibility:hidden; border-radius:0 4px 4px 0; }
html[data-design="archive"] .book .cover .front { background-color:var(--series); background-image:url(img/kari/cloth.svg); background-blend-mode:multiply; color:#f2e9d6; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:.4rem; box-shadow:inset 6px 0 10px rgba(0,0,0,.3); }
html[data-design="archive"] .book .cover .back { transform:rotateY(180deg); background:var(--paper) url(img/kari/index.svg) center/cover; border-radius:4px 0 0 4px; padding:1.2rem; display:flex; flex-direction:column; gap:.3rem; }
html[data-design="archive"] .book[data-open] .cover { transform:rotateY(-180deg); }
html[data-design="archive"] .book .b-code { font:600 2.6rem/1 var(--serif); }
html[data-design="archive"] .book .front .b-name { font:900 1.1rem/1.3 var(--heavy); text-align:center; padding:0 1rem; }
html[data-design="archive"] .book .b-k { font:500 .64rem var(--led); color:var(--sub); letter-spacing:.08em; }
html[data-design="archive"] .book .b-v { font:600 1.2rem var(--serif); color:var(--sign); }
html[data-design="archive"] .book .b-go { align-self:flex-start; margin-top:.4rem; padding:.5rem .9rem; background:var(--indigo); color:#f6efe2; text-decoration:none; font:900 .9rem var(--heavy); }
html[data-design="archive"] .book .b-close { position:absolute; top:-46px; right:0; width:40px; height:40px; border:1px solid #f2e9d6; background:transparent; color:#f2e9d6; font:500 1rem var(--led); cursor:pointer; }
@media (prefers-reduced-motion: reduce) {
  html[data-design="archive"] .book, html[data-design="archive"] .book .cover, html[data-design="archive"] main .yrsets .setrow { transition:none; }
}
