.tr-dialog { width:min(580px,calc(100vw - 20px)); max-height:min(760px,calc(100dvh - 24px)); padding:0; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--text); box-shadow:0 18px 60px #0005; overflow:auto; }
.tr-dialog::backdrop { background:#1619229c; }
.tr-head { display:flex; align-items:center; gap:10px; position:sticky; top:0; z-index:2; padding:12px 16px; background:var(--surface); border-bottom:1px solid var(--line); }
.tr-head h2 { flex:1; margin:0; font-size:19px; }
.tr-spark { color:#a681c9; font-size:26px; line-height:1; }
.tr-participant{display:grid;grid-template-columns:minmax(0,1fr) 85px 70px;gap:8px;padding:8px 0;border-bottom:1px solid var(--line);font-size:12px}.tr-participant strong{overflow-wrap:anywhere}
.tr-close { width:32px; height:32px; border:0; border-radius:8px; background:transparent; color:var(--text); cursor:pointer; }
.tr-body { padding:14px; }
.tr-controls,.tr-actions,.tr-create-fields { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.tr-controls { justify-content:flex-end; margin-bottom:10px; }
.tr-create { display:grid; gap:10px; margin-bottom:14px; padding:12px; border:1px solid #b7a0d2; border-radius:12px; background:color-mix(in srgb,#8e6cb4 9%,var(--surface)); }
.tr-create-fields > * { flex:1 1 100px; }
.tr-input { min-height:36px; max-width:100%; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text); padding:5px 8px; }
.tr-action { min-height:34px; padding:6px 10px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text); cursor:pointer; font:inherit; font-size:13px; }
.tr-action.primary { border-color:#8964ac; background:#76519b; color:white; font-weight:700; }
.tr-action:disabled { opacity:.55; cursor:default; }
.tr-list { display:grid; gap:9px; }
.tr-card { min-width:0; padding:11px 12px; border:1px solid var(--ot-edge); border-radius:var(--ot-shape); background:var(--ot-soft); color:var(--ot-ink); }
.tr-row { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tr-name { font-size:15px; }
.tr-status { font-size:12px; white-space:nowrap; }
.tr-meta { margin:6px 0; font-size:12px; opacity:.9; }
.tr-winner { margin:8px 0; font-weight:700; }
.tr-empty,.tr-info { margin:20px 0; text-align:center; color:var(--text-2); }
.tr-error { color:#c83348; font-size:12px; }
.cm-raffle-pin-wrap:empty { display:none; }
.cm-raffle-pin { display:flex; align-items:center; gap:9px; margin:5px 8px 2px; padding:7px 10px; border:1px solid #af8bca; border-left:4px solid #8f69b4; border-radius:7px 13px 13px 7px; background:color-mix(in srgb,#bfa4db 16%,var(--surface)); color:var(--text); box-shadow:0 2px 0 #8f69b42b; }
.cm-raffle-pin > .i { flex:none; color:#8f69b4; }
.cm-raffle-pin-main { min-width:0; flex:1; display:flex; align-items:baseline; flex-wrap:wrap; column-gap:7px; }
.cm-raffle-pin-main strong { font-size:13px; }
.cm-raffle-pin-main small { font-size:11px; color:var(--text-2); }
.cm-raffle-pin-join,.cm-raffle-pin-link { flex:none; min-height:30px; padding:3px 9px; border:1px solid #9875b6; border-radius:7px; background:#8054a5; color:white; font:inherit; font-size:12px; font-weight:700; cursor:pointer; }
.cm-raffle-pin-link { background:var(--surface); color:var(--text); }
.cm-raffle-pin-join:disabled { opacity:.65; }
@media(max-width:480px) { .tr-dialog { width:calc(100vw - 12px); max-height:calc(100dvh - 12px); border-radius:12px; } .tr-create-fields > .tr-input { flex:1 1 calc(50% - 5px); } .tr-create-fields > button { flex-basis:100%; } }
@media(max-width:480px) { .cm-raffle-pin { gap:5px; padding:6px; } .cm-raffle-pin-main small { width:100%; } .cm-raffle-pin-join,.cm-raffle-pin-link { padding:3px 6px; } }