/* 167（2026-10-08）「触れる」と分かるUI（MIEKATA・AIKATA共通）。影なし */
.try167{--c:#2448d8;--bg:#eef2ff;display:inline-flex;align-items:center;gap:8px;margin:0 0 14px!important;padding:6px 14px 6px 8px;border-radius:999px;background:var(--bg);border:1.5px dashed var(--c);color:var(--c);font-size:16px;font-weight:700;line-height:1.3;transition:opacity .4s,transform .4s}
.try167 b{padding:2px 8px;border-radius:999px;background:var(--c);color:#fff;font:700 13px/1.4 Arial,sans-serif;letter-spacing:.1em}
.try167-hand{display:inline-grid;place-items:center;width:30px;height:30px;color:var(--c);animation:try167tap 1.6s ease-in-out infinite}
.try167-hand svg{width:26px;height:26px}
@keyframes try167tap{0%,100%{transform:translate(0,0) rotate(0)}30%{transform:translate(2px,4px) rotate(-6deg)}45%{transform:translate(2px,6px) rotate(-6deg) scale(.92)}60%{transform:translate(0,0)}}
.is-used167 .try167{opacity:.55}
.is-used167 .try167-hand{animation:none}
body.aikata .try167{--c:#4b3bd0;--bg:#f6f3ff}
body.aikata .card165 .try167{--c:#f3c876;--bg:rgba(255,255,255,.08);color:#f3c876}
body.aikata .card165 .try167 b{color:#29243c}
.bk155-head .try167,.dial165-head .try167{margin-left:auto!important;margin-right:auto!important}
[data-mo165] .try167{grid-column:1/-1;justify-self:start}

/* 積み木のボタン：指がタップする */
.tap167{position:absolute;right:10px;bottom:-14px;width:34px;height:34px;color:#141c4c;pointer-events:none;animation:tap167 1.4s ease-in-out infinite;z-index:2}
.tap167 svg{width:34px;height:34px}
@keyframes tap167{0%,100%{transform:translate(0,0)}40%{transform:translate(-6px,-10px)}55%{transform:translate(-6px,-6px) scale(.9)}}
.bk155-add:first-of-type{animation:tap167ring 1.4s ease-in-out infinite}
.is-used167 .bk155-add:first-of-type{animation:none}
@keyframes tap167ring{0%,100%{border-color:#c9d3fb}55%{border-color:#2448d8;background:#e8edff}}

/* スライダー：つまみが「動かせる」と分かる目印 */
.has-try167 input[type=range]{cursor:grab}
.has-try167:not(.is-used167) input[type=range]::-webkit-slider-thumb{animation:thumb167 1.6s ease-in-out infinite}
@keyframes thumb167{0%,100%{outline:0 solid rgba(36,72,216,0)}50%{outline:8px solid rgba(36,72,216,.18)}}
.has-try167:not(.is-used167) .dial165-gauge::after{content:'← ドラッグして回す →';display:block;margin-top:8px;font-size:14px;font-weight:700;color:#4b3bd0;animation:hint167 1.6s ease-in-out infinite}
.has-try167:not(.is-used167) .mo165-range::after{content:'← ドラッグで月数を変える →';font-size:14px;font-weight:700;color:#2448d8;animation:hint167 1.6s ease-in-out infinite}
@keyframes hint167{0%,100%{opacity:.55}50%{opacity:1}}
/* 社員証：入力欄を目立たせる */
.has-try167:not(.is-used167) [data-card165-name]{animation:field167 1.8s ease-in-out infinite}
@keyframes field167{0%,100%{border-color:rgba(255,255,255,.3)}50%{border-color:#f3c876}}
@media(prefers-reduced-motion:reduce){.try167-hand,.tap167,.bk155-add:first-of-type,.has-try167 input[type=range]::-webkit-slider-thumb,.has-try167 .dial165-gauge::after,.has-try167 .mo165-range::after,.has-try167 [data-card165-name]{animation:none!important}}
@media(min-width:601px){.has-try167 .dial165-gauge::after,.has-try167 .mo165-range::after{font-size:16px}}
@media(max-width:600px){.try167{font-size:14px}.tap167{display:none}}
.try167 b{font-size:16px!important}
@media(max-width:600px){.try167 b{font-size:14px!important}}
/* 174（2026-10-09）勝手に動く目印はやめる：積み木ボタンの点滅 */
.bk155-add:first-of-type{animation:none!important}
