/* The item card a tap opens (client/itemtip.js) */
.it-tip { position: fixed; z-index: 80; max-width: min(300px, calc(100vw - 16px)); padding: 12px 14px; border-radius: 14px; background: #f6efe0; color: #4a3626; box-shadow: 0 8px 22px rgba(0,0,0,.45); animation: itIn .14s ease-out; pointer-events: auto; }
@keyframes itIn { from { opacity: 0; transform: translateY(4px); } }
.it-tip .nm { display: block; font: 900 18px/1.2 system-ui; }
.it-tip .own { margin-top: 2px; padding-bottom: 6px; border-bottom: 1px solid #d8c8a8; font-weight: 800; font-size: 14px; }
.it-tip .desc { margin-top: 6px; font-size: 14px; line-height: 1.35; }
.it-tip .arrow { position: absolute; bottom: -8px; width: 16px; height: 16px; margin-left: -8px; background: #f6efe0; transform: rotate(45deg); }
.it-tip.below .arrow { bottom: auto; top: -8px; }
[data-tip] { cursor: pointer; }
.it-tip .acts { display: flex; gap: 8px; margin-top: 10px; }
.it-tip .acts button { flex: 1; min-height: 38px; border-radius: 10px; font-weight: 900; background: #e8dcc4; border: 1px solid #c8b490; color: #4a3626; }
.it-tip .acts button.primary { background: linear-gradient(#ffd97a, #e3a12f); border-color: #b8761a; color: #3a2204; }