[data-experience-panel][hidden], [data-experience-device][hidden], [data-experience-error][hidden], [data-experience-qr-preview][hidden], [data-remove-experience-qr][hidden] { display: none !important; }
.experience-methods { border: 0; padding: 0; margin: 0 0 22px; }
.experience-methods legend, .experience-field-title { font-size: 14px; font-weight: 800; margin-bottom: 10px; }
.experience-methods legend small { margin-left: 8px; font-size: 12px; font-weight: 400; color: #747474; }
.entry-form .experience-options { display: flex; flex-wrap: wrap; gap: 10px; }
.entry-form .experience-options label { display: flex; align-items: center; gap: 9px; padding: 12px 18px; border: 1px solid #ddd; border-radius: 11px; cursor: pointer; font-size: 14px; }
.entry-form .experience-options input { width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; accent-color: #165cff; }
.entry-form .experience-options label:has(input:checked) { color: #165cff; border-color: #165cff; background: #edf3ff; }
.entry-form .experience-options label:focus-within { outline: 2px solid #165cff; outline-offset: 3px; }
.experience-panel { margin-bottom: 18px; padding: 18px; background: #fafbfe; border: 1px solid #e5e8ef; border-radius: 14px; }
.entry-form .experience-panel label, .entry-form .experience-device label, .entry-form .experience-notes { font-size: 14px; }
.experience-field-title { display: inline-flex; align-items: center; gap: 4px; margin: 0; }
.entry-form .experience-panel textarea { min-height: 76px; }
.experience-device { margin: 0 0 18px; max-width: 420px; }
.experience-form-tip { color: #777; font-size: 12px; line-height: 1.65; margin-top: 14px; }
.experience-panel .experience-field-help { color: #747474; font-weight: 400; font-size: 12px; }
.entry-form .experience-error { color: #ce392d; font-size: 13px; font-weight: 500; margin-top: 6px; }
.experience-invalid input, .experience-invalid textarea, .experience-invalid select, .experience-invalid .experience-options label { border-color: #ce392d !important; }
.experience-qr-editor { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; margin-top: 12px; }
.experience-qr-editor img { width: 172px; height: 172px; object-fit: contain; background: #fff; padding: 10px; border: 1px solid #e1e4eb; border-radius: 8px; }
.experience-qr-editor > div { flex: 1; min-width: 190px; }
.entry-form .experience-qr-editor input { padding: 8px; min-height: 0; font-size: 13px; }
.experience-qr-editor button { margin-top: 8px; padding: 6px 10px; background: #fff; border: 1px solid #ddd; border-radius: 6px; color: #555; cursor: pointer; }
.experience-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.experience-actions a, .experience-actions button { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 8px 14px; font-family: inherit; font-size: 14px; font-weight: 750; border: 1px solid #d9dfe8; color: #17479a; background: #f2f6ff; border-radius: 999px; cursor: pointer; text-decoration: none; }
.experience-actions > span { color: #888; font-size: 13px; }
.showcase-card .experience-actions { margin: 16px 0 0; }
.showcase-card .experience-actions a, .showcase-card .experience-actions button { color: #111; background: #ffdd00; border-color: #ffdd00; font-size: 12px; }
.experience-dialog { width: min(520px, calc(100vw - 28px)); max-height: 88vh; padding: 0; border: 0; border-radius: 22px; box-shadow: 0 25px 80px #0003; color: #171b25; background: #fff; }
.experience-dialog::backdrop { background: #0009; }
.experience-dialog header { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; padding: 24px; border-bottom: 1px solid #edf0f5; }
.experience-dialog header small { color: #165cff; font-size: 13px; }
.experience-dialog h2 { margin: 6px 0 0; font-size: 23px; overflow-wrap: anywhere; }
.experience-dialog header button { border: 0; font-size: 28px; color: #333; background: #f5f5f5; border-radius: 50%; width: 36px; height: 36px; flex-shrink: 0; cursor: pointer; }
.experience-dialog-content { padding: 0 24px 22px; }
.experience-dialog section { padding: 18px 0; border-bottom: 1px solid #edf0f5; }
.experience-dialog h3 { margin: 0 0 12px; font-size: 16px; }
.experience-dialog p { font-size: 14px; line-height: 1.7; color: #626a78; white-space: pre-wrap; overflow-wrap: anywhere; }
.experience-dialog .experience-qr { display: block; width: min(260px, 100%); height: auto; max-height: 300px; object-fit: contain; margin: 0 auto; padding: 12px; background: #fff; }
.experience-dialog .experience-qr[hidden] { display: none; }
.experience-dialog .experience-primary, .experience-dialog [data-copy-search] { display: inline-block; padding: 10px 16px; border: 0; border-radius: 9px; font-size: 14px; color: #fff; background: #165cff; cursor: pointer; text-decoration: none; }
.experience-search-name { display: block; padding: 12px 0; color: #151923; font-size: 20px; overflow-wrap: anywhere; }
@media (max-width: 600px) { .experience-panel { padding: 14px; } .entry-form .experience-options label { flex: 1; justify-content: center; padding: 11px 8px; white-space: nowrap; } .experience-qr-editor { justify-content: center; } }