/* 虚构世界 — a save-file / achievement shelf, plus a character mirror wall */
.shelf-content{min-height:620px;padding:56px clamp(24px,4vw,70px) 96px;background-color:var(--deep);background-image:radial-gradient(ellipse at 18% 20%,rgba(219,211,188,.045),transparent 35%),radial-gradient(ellipse at 82% 72%,rgba(15,20,17,.2),transparent 46%);color:var(--pale)}

.shelf-tabs{display:flex;gap:2px;margin-bottom:30px;border-bottom:1px solid rgba(225,217,199,.16)}
.shelf-tabs button{padding:11px 22px;border:0;background:transparent;color:inherit;cursor:pointer;font-size:12.5px;letter-spacing:.16em;opacity:.5;position:relative;top:1px;transition:opacity .3s}
.shelf-tabs button:hover{opacity:.8}
.shelf-tabs button.active{opacity:1;color:var(--paper);border-bottom:1px solid var(--rust)}

.shelf-tools{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;margin-bottom:30px}
.shelf-count{margin:0;font:11px var(--latin);letter-spacing:.18em;opacity:.62}
.shelf-count span{font-size:20px;margin-right:5px;color:var(--paper)}
.shelf-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.shelf-filters button{padding:6px 13px;border:1px solid rgba(225,217,199,.24);background:transparent;color:inherit;cursor:pointer;font-size:10.5px;letter-spacing:.1em;transition:.3s}
.shelf-filters button:hover,.shelf-filters button.active{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.shelf-search{position:relative;width:170px;border-bottom:1px solid rgba(225,217,199,.32)}
.shelf-search input{width:100%;padding:6px 4px;border:0;outline:0;background:transparent;color:var(--pale);font-size:12px}
.shelf-search input::placeholder{color:rgba(225,217,199,.45)}

.shelf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;perspective:1400px}
.save-card{position:relative;height:250px;cursor:pointer;animation:cardIn .6s ease both}
.save-card:nth-child(2){animation-delay:.05s}.save-card:nth-child(3){animation-delay:.1s}.save-card:nth-child(4){animation-delay:.15s}.save-card:nth-child(5){animation-delay:.2s}.save-card:nth-child(6){animation-delay:.25s}
.save-card-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.4,0,.2,1)}
.save-card:hover .save-card-inner,.save-card:focus-within .save-card-inner{transform:rotateY(180deg)}
.save-face{position:absolute;inset:0;backface-visibility:hidden;padding:24px;display:flex;flex-direction:column;border:1px solid rgba(225,217,199,.1)}
.save-front{background:var(--paper);color:var(--ink)}
.save-back{background:#2a2f2b;color:var(--pale);transform:rotateY(180deg);justify-content:space-between}
.save-slot{margin:0 0 auto;font:9.5px var(--latin);letter-spacing:.22em;color:var(--rust)}
.save-type-icon{position:absolute;right:20px;top:22px;width:22px;height:22px;stroke:var(--rust);fill:none;stroke-width:1.3;opacity:.85}
.save-front h2{margin:0 0 8px;font-size:22px;font-weight:500;letter-spacing:.03em}
.save-meta{margin:0 0 16px;font-size:10px;letter-spacing:.1em;opacity:.55}
.save-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.save-tags span{font-size:9px;padding:3px 7px;border:1px solid rgba(34,37,33,.25)}
.save-back-excerpt{margin:0;font-size:12.5px;line-height:1.85;opacity:.9}
.save-back-more{align-self:flex-start;padding:8px 0;border:0;background:none;color:var(--pale);font-size:10.5px;letter-spacing:.14em;cursor:pointer;opacity:.75;border-bottom:1px solid rgba(225,217,199,.4)}
.save-back-more:hover{opacity:1}
.shelf-empty{grid-column:1/-1;padding:70px 20px;text-align:center;border:1px solid rgba(225,217,199,.18);opacity:.6}

.character-wall{margin-top:76px;padding-top:44px;border-top:1px solid rgba(225,217,199,.16)}
.character-heading{margin:0 0 30px}
.character-heading p{margin:0 0 10px;font:11px var(--latin);letter-spacing:.32em;color:var(--rust)}
.character-heading h2{margin:0;font-size:clamp(19px,2.3vw,25px);font-weight:500;letter-spacing:.03em;opacity:.92}
.character-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:22px}
.character-card{padding:26px 22px;background:rgba(225,217,199,.045);border:1px solid rgba(225,217,199,.14)}
.character-ring{width:38px;height:38px;border-radius:50%;border:1px solid var(--rust);margin-bottom:16px;position:relative}
.character-ring:after{content:"";position:absolute;inset:6px;border-radius:50%;border:1px solid rgba(225,217,199,.35)}
.character-card h3{margin:0 0 4px;font-size:17px;font-weight:500}
.character-work{margin:0 0 12px;font-size:10.5px;letter-spacing:.08em;opacity:.55}
.character-note{margin:0;font-size:12.5px;line-height:1.85;opacity:.85}

@media(max-width:950px){.shelf-tools{grid-template-columns:1fr auto}.shelf-filters{grid-row:2;grid-column:1/-1;justify-content:flex-start}}
@media(max-width:620px){
  .shelf-content{padding:40px 20px 70px}
  .shelf-tabs{overflow-x:auto}
  .shelf-tools{grid-template-columns:1fr}
  .shelf-search{width:100%}
  .shelf-grid{grid-template-columns:1fr}
  .save-card{height:230px}
}