/* 判定スタンプ（共通の部品）。templates/play/_stamp.html・play/stamps/<形>.html
 *
 * 見本 第3版（判断票31回目 k3=a）の見た目を移したもの。かすれ・にじみは入れない（くっきり平ら）。
 * 形と色は data の ui.stamp_shape / ui.stamp_color（front/shindan/stamps.py）。レアな結果は gold。
 *
 * 押す地（ground）で描き方を変える:
 *   台紙あり（既定）… 場面の絵・紺の上。羊皮紙の台紙を形なりに敷いて、その上に押す（いままでの羊皮紙の札と同じ考え）
 *   --onpaper      … 羊皮紙の上（結果の札）。台紙を描かず、乗算で紙になじませる
 *   --ondark       … 紺の上（今日の一枚）。台紙を描かず、明るい側の色で押す
 *   --onnight      … 結果ページのレアの金の判子。紺の台紙を敷いて、明るい側の色（金 #f2c94c）で押す
 * 大きさ: 幅 = 形ごとの基準（--stamp-w・stamps.SHAPES の size）× 場面ごとの倍率（--stamp-k）。
 *   ドット絵の形（--pixel）は1マスが整数の画素になる倍率（--stamp-kd: 0.5 / 1 / 1.5 / 2）でしか拡大しない。
 * 押す動き: 0.3秒で 1.6 → 0.95 → 1.03 → 1。fill-mode は使わない（終わりの形＝ふだんの形にしてある）。
 */

.pl-stamp {
    --stamp-paper: #fbf3df;
    line-height: 0;
    pointer-events: none;
}

.pl-stamp[hidden] {
    display: none;
}

.pl-stamp svg {
    display: block;
    width: calc(var(--stamp-w) * var(--stamp-k, 1));
    max-width: 100%;
    height: auto;
    overflow: visible;
    transform: rotate(var(--stamp-r, -6deg));
    animation: pl-stamp-slam 0.3s cubic-bezier(0.2, 0.8, 0.25, 1);
}

.pl-stamp--pixel svg {
    width: calc(var(--stamp-w) * var(--stamp-kd, 1));
}

@keyframes pl-stamp-slam {
    0% {
        opacity: 0;
        transform: rotate(var(--stamp-r, -6deg)) scale(1.6);
    }

    40% {
        opacity: 1;
    }

    55% {
        transform: rotate(var(--stamp-r, -6deg)) scale(0.95);
    }

    75% {
        transform: rotate(var(--stamp-r, -6deg)) scale(1.03);
    }

    100% {
        opacity: 1;
        transform: rotate(var(--stamp-r, -6deg)) scale(1);
    }
}

.pl-stamp text {
    user-select: none;
}

.pl-stamp-paper {
    fill: var(--stamp-paper);
    opacity: 0.96;
}

.pl-stamp--onpaper .pl-stamp-paper,
.pl-stamp--ondark .pl-stamp-paper {
    display: none;
}

/* 夜の台紙（結果ページのレアの金の判子）。紺の台紙に明るい側の色で押す */
.pl-stamp--onnight {
    --stamp-paper: #0b1a2e;
}

.pl-stamp--onpaper svg {
    mix-blend-mode: multiply;
}

/* 押す場面の絵の上では、台紙ごと少し浮かせる（絵に沈まないように） */
.pl-stamp:not(.pl-stamp--onpaper):not(.pl-stamp--ondark):not(.pl-stamp--fuurou) svg {
    filter: drop-shadow(0 3px 0 rgba(0, 8, 20, 0.35));
}

/* ---- 書体（Google Fonts の text= で、使う字だけを取り寄せる。stamps.FONTS と対応） ---- */

.pl-sf-rub {
    font-family: "Shippori Antique B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.pl-sf-sho {
    font-family: "Yuji Syuku", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.pl-sf-min {
    font-family: "Zen Antique", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.pl-sf-os {
    font-family: "Oswald", "Arial Narrow", sans-serif;
    font-weight: 500;
}

.pl-sf-os6 {
    font-family: "Oswald", "Arial Narrow", sans-serif;
    font-weight: 600;
}

.pl-sf-bb {
    font-family: "Bebas Neue", "Oswald", "Arial Narrow", sans-serif;
}

.pl-sf-dot {
    font-family: "DotGothic16", monospace;
}

/* 隠している間に書体を取り寄せておくための、見えない1行 */
.pl-stamp-warm {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    pointer-events: none;
}

/* ---- 色（見本の「色を替える」: 朱=判定・認定／鳶=記録・冒険／藍=受付・入国／緑=承認・命名／紫=闇・魔王／墨=消印／金=祝・レア） ---- */

.pl-stamp--c-shu {
    color: #c8321e;
}

.pl-stamp--c-tobi {
    color: #8a3b2c;
}

.pl-stamp--c-ai {
    color: #1f3a70;
}

.pl-stamp--c-midori {
    color: #256b3f;
}

.pl-stamp--c-murasaki {
    color: #5b2d8e;
}

.pl-stamp--c-sumi {
    color: #2a2622;
}

.pl-stamp--c-gold {
    color: #b8862b;
}

/* 紺の上・紺の台紙では明るい側の色（見本の「紺」） */
.pl-stamp--ondark.pl-stamp--c-shu,
.pl-stamp--onnight.pl-stamp--c-shu {
    color: #ff7358;
}

.pl-stamp--ondark.pl-stamp--c-tobi,
.pl-stamp--onnight.pl-stamp--c-tobi {
    color: #f0a37a;
}

.pl-stamp--ondark.pl-stamp--c-ai,
.pl-stamp--onnight.pl-stamp--c-ai {
    color: #8db4ff;
}

.pl-stamp--ondark.pl-stamp--c-midori,
.pl-stamp--onnight.pl-stamp--c-midori {
    color: #8fd9a5;
}

.pl-stamp--ondark.pl-stamp--c-murasaki,
.pl-stamp--onnight.pl-stamp--c-murasaki {
    color: #c79cff;
}

.pl-stamp--ondark.pl-stamp--c-sumi,
.pl-stamp--onnight.pl-stamp--c-sumi {
    color: #e6dcc4;
}

.pl-stamp--ondark.pl-stamp--c-gold,
.pl-stamp--onnight.pl-stamp--c-gold {
    color: #f2c94c;
}

/* 封蝋は色ではなく蝋の濃淡（見本 10）。金の蝋はレア */
.pl-stamp--fuurou {
    --wax-0: #c8384a;
    --wax-1: #9c1f30;
    --wax-2: #5e1020;
    --wax-3: #3a0912;
    --wax-ring: #7d1727;
    --wax-text: #8c1a2b;
    --wax-light: #f0a3ad;
    --wax-hi: #ffd9d9;
}

.pl-stamp--fuurou.pl-stamp--c-gold {
    --wax-0: #f6d77e;
    --wax-1: #d4a53a;
    --wax-2: #8e6414;
    --wax-3: #4f3506;
    --wax-ring: #9c7018;
    --wax-text: #a57a1c;
    --wax-light: #fff0bf;
    --wax-hi: #fff6d8;
}

@media (prefers-reduced-motion: reduce) {
    .pl-stamp svg {
        animation: none;
    }
}