/* sumozoia sketch music: red hanko seals sit on the title line, never on the artwork */
.szs-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* gallery card: small seal at the end of the title row = a real play/pause button (no extra row height; 36px touch target via ::before) */
.szs-mark{appearance:none;-webkit-appearance:none;cursor:pointer;position:relative;display:inline-flex;margin-top:-.4em;margin-bottom:-.4em;padding:0;border:0;align-items:center;justify-content:center;width:1.25em;height:1.25em;margin-left:.45em;vertical-align:middle;border-radius:48% 52% 50% 50%/52% 48% 52% 48%;background:#e63d2c;color:#fff;font:inherit;line-height:1;-webkit-tap-highlight-color:transparent;transition:transform .2s,background .2s,color .2s}
.szs-mark::before{content:"";position:absolute;left:50%;top:50%;width:max(100%,36px);height:max(100%,36px);transform:translate(-50%,-50%)}
.szs-mark svg{width:.78em;height:.78em;display:block;pointer-events:none}
.szs-mark .szs-i-pause{display:none}
.szs-mark.is-on .szs-i-note{display:none}
.szs-mark.is-on .szs-i-pause{display:block}
.szs-mark:hover{transform:scale(1.1)}
.szs-mark:focus-visible{outline:2px solid #1f1d1e;outline-offset:3px}
.szs-mark::after{content:"";position:absolute;inset:-1px;border-radius:inherit;border:1px solid #e63d2c;opacity:0;pointer-events:none}
.sk-card:hover .szs-mark::after,.sk-card:focus-within .szs-mark::after,.work-card:hover .szs-mark::after,.work-card:focus-within .szs-mark::after{animation:szs-ring 1.8s ease-out infinite}
.szs-mark.is-on::after,.sk-card:hover .szs-mark.is-on::after,.work-card:hover .szs-mark.is-on::after{border-width:1.5px;animation:szs-ring 1.6s ease-out infinite}
/* take II: tiny paper seal with a red rim; fills in when playing */
.szs-mark.szs-m2{margin-left:.3em;background:#fafafa;color:#e63d2c;box-shadow:inset 0 0 0 1.5px #e63d2c;font-family:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",Georgia,serif;font-weight:700;font-size:inherit}
.szs-mark.szs-m2 span{font-size:.58em;letter-spacing:-.04em;display:block}
.szs-mark.szs-m2.is-on{background:#e63d2c;color:#fff}
.szs-mark.szs-nofit{display:none}
/* seals */
.szs-panel{display:inline-flex;align-items:center;gap:6px;vertical-align:middle;margin-left:.6em;white-space:nowrap}
.szs-panel .szs-seal,.szs-panel button.szs-seal{appearance:none;-webkit-appearance:none;cursor:pointer;position:relative;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;min-width:28px;padding:0;margin:0;border:1.5px solid #e63d2c;border-radius:48% 52% 50% 50%/52% 48% 52% 48%;background:#e63d2c;color:#fff;font:600 13px/1 "Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",Georgia,serif;-webkit-tap-highlight-color:transparent;transition:background .25s,color .25s,transform .25s}
.szs-panel button.szs-seal:hover{transform:scale(1.07);background:#e63d2c;color:#fff}
.szs-panel button.szs-seal:focus-visible{outline:2px solid #1f1d1e;outline-offset:2px;background:#e63d2c;color:#fff}
.szs-panel.szs-in-lb button.szs-seal:focus-visible{outline-color:#fafafa}
.szs-panel button.szs-seal:not(:only-child){background:#fafafa;color:#e63d2c}
.szs-panel button.szs-seal:not(:only-child):hover,.szs-panel button.szs-seal:not(:only-child):focus-visible{background:#fafafa;color:#e63d2c}
.szs-panel button.szs-seal:not(:only-child).is-on{background:#e63d2c;color:#fff}
.szs-panel button.szs-seal::after{content:"";position:absolute;inset:-2px;border-radius:inherit;border:1.5px solid #e63d2c;opacity:0;pointer-events:none}
.szs-panel button.szs-seal.is-on::after{animation:szs-ring 2.6s ease-out infinite}
.szs-panel button.szs-seal.is-on span{display:block;animation:szs-nod 2.6s ease-in-out infinite}
/* track caption: quiet, beside/under the title row */
.szs-cap{font-size:12px;letter-spacing:.05em;line-height:1.4;opacity:0;transition:opacity 1s ease}
.szs-cap.is-playing{opacity:1}
.szs-cap.szs-in-page{display:block;min-height:1.4em;margin:.1rem 0 .9rem;color:#5a5654}
.sk-lb figcaption .szs-cap.szs-in-lb{position:absolute;left:0;right:0;top:100%;margin-top:.35rem;text-align:center;color:#bdb7b2}
.sk-lb figcaption{position:relative}
.sk-lb figcaption .szs-panel{margin-left:.5em;margin-right:.1em}
/* detail page: seals sit on the title line */
.work h1.szs-h1{display:inline-block;max-width:100%;vertical-align:middle}
.work .szs-panel.szs-in-page{margin-left:.7rem}
/* the sketch breathes (ink pulse on the image itself) */
.szs-breathe{animation:szs-breath 7s ease-in-out infinite;will-change:transform}
@keyframes szs-ring{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.85)}}
@keyframes szs-breath{0%,100%{transform:scale(1)}50%{transform:scale(1.008)}}
@keyframes szs-nod{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@media (max-width:760px){.szs-mark::before{left:auto;right:0;transform:translateY(-50%)}.szs-mark.szs-m2::before{left:0;right:auto;width:100%}.szs-mark{margin-right:-1.75em}.szs-mark.szs-has2{margin-right:0}.szs-panel .szs-seal,.szs-panel button.szs-seal{width:34px;height:34px;min-width:34px}}
@media (prefers-reduced-motion:reduce){
  .sk-card:hover .szs-mark::after,.sk-card:focus-within .szs-mark::after,.work-card:hover .szs-mark::after,.work-card:focus-within .szs-mark::after,.szs-panel button.szs-seal.is-on::after,.szs-mark.is-on::after,.sk-card:hover .szs-mark.is-on::after,.work-card:hover .szs-mark.is-on::after{animation:none;opacity:0}
  .szs-panel button.szs-seal.is-on span,.szs-breathe{animation:none!important}
  .szs-mark.is-on{box-shadow:0 0 0 3px rgba(230,61,44,.35)}
  .szs-mark,.szs-mark:hover{transition:none;transform:none}
  .szs-panel button.szs-seal.is-on{box-shadow:0 0 0 3px rgba(230,61,44,.35)}
  .szs-cap{transition:none}
}
@media print{.szs-panel,.szs-mark,.szs-cap{display:none}}