.poll-composer { padding:20px; border:1px solid var(--line); border-radius:12px; background:var(--surface-soft); }
.poll-composer[hidden] { display:none; }
.poll-composer fieldset, .poll-card fieldset { border:0; padding:0; margin:16px 0; min-width:0; }
.poll-composer legend { font-weight:700; margin-bottom:10px; }
.poll-composer>small { display:block; text-align:right; color:var(--muted); }
.poll-answer-editor { display:flex; gap:8px; margin-bottom:10px; }
.poll-answer-editor input { margin:0; min-width:0; }
.poll-answer-editor .poll-answer-emoji { flex:0 0 56px; width:56px; padding:8px; text-align:center; }
.poll-answer-editor button { flex:0 0 36px; border:0; background:transparent; color:var(--muted); font-size:var(--text-base); }
.poll-settings { display:flex; align-items:center; flex-wrap:wrap; gap:20px; margin-top:20px; }
.poll-settings>label { flex:1 1 220px; }
.poll-settings .poll-multiple { display:flex; gap:10px; align-items:center; }
.poll-multiple input { width:18px; height:18px; margin:0; flex:none; }
.poll-card { border:1px solid var(--line); border-radius:14px; padding:clamp(16px,3vw,24px); background:var(--surface-soft); margin-block:16px; }
.poll-card h3 { margin:8px 0 16px; font-family:var(--font-display); font-size:var(--text-card); font-weight:700; line-height:1.4; overflow-wrap:anywhere; }
.poll-card form { margin:0; }
.poll-card .poll-option { position:relative; display:flex; align-items:center; gap:12px; overflow:hidden; margin:8px 0; padding:13px; border:1px solid var(--line); border-radius:9px; background:var(--surface); cursor:pointer; }
.poll-option input { flex:0 0 18px; width:18px; height:18px; margin:0; }
.poll-option span { flex:1; overflow-wrap:anywhere; }
.poll-card .poll-option { font-size:var(--text-small); font-weight:500; line-height:1.5; }
.poll-option>strong, .poll-results strong { font-size:inherit; font-weight:600; }
.poll-option>input,.poll-option>span,.poll-option>strong { position:relative; z-index:1; }
.poll-option.is-selected { border-color:var(--green); }
.poll-option progress { position:absolute; inset:0; width:100%; height:100%; margin:0; border:0; border-radius:0; appearance:none; opacity:.3; background:transparent; }
.poll-option progress::-webkit-progress-bar { background:transparent; border-radius:0; }
.poll-option progress::-webkit-progress-value { background:var(--green); border-radius:0; }
.poll-option progress::-moz-progress-bar { background:var(--green); border-radius:0; }
.poll-meta,.poll-actions { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-top:14px; }
.poll-meta { color:var(--muted); font-size:var(--text-small); }
.poll-results { margin-top:16px; font-size:var(--text-small); }
.poll-results > summary { display:flex; align-items:center; gap:10px; width:fit-content; max-width:100%; min-height:44px; padding:10px 14px; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--green); font-weight:600; cursor:pointer; list-style:none; }
.poll-results > summary::-webkit-details-marker { display:none; }
.poll-results > summary:hover { background:var(--sage); }
.poll-results-chevron { margin-left:8px; font-size:.75em; }
.poll-results[open] .poll-results-chevron { transform:rotate(180deg); }
.poll-results-list { list-style:none; margin:12px 0 0; padding:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--surface); }
.poll-result { display:grid; grid-template-columns:minmax(0,1fr) 5.5em 4.5em 10.5em; align-items:center; gap:12px; padding:12px 14px; }
.poll-result + .poll-result { border-top:1px solid var(--line); }
.poll-result-label { min-width:0; overflow-wrap:anywhere; font-weight:600; }
.poll-result-count { color:var(--muted); text-align:right; font-variant-numeric:tabular-nums; }
.poll-result-percent { padding:5px 8px; border-radius:6px; background:var(--sage); color:var(--green); text-align:center; font-variant-numeric:tabular-nums; white-space:nowrap; }
.poll-result-action button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:8px; border:0; border-radius:6px; background:transparent; color:var(--green); font:inherit; font-size:var(--text-small); font-weight:600; cursor:pointer; }
.poll-result-action button:hover { background:var(--sage); text-decoration:underline; text-underline-offset:3px; }
.poll-results > summary:focus-visible,.poll-result-action button:focus-visible { outline:2px solid var(--green); outline-offset:2px; }
.poll-voters-context { padding-bottom:12px; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.poll-voters-context p { margin:0 0 8px; color:var(--muted); font-size:var(--text-small); }
.poll-voters-context strong { display:block; }
.poll-close { text-decoration:underline; text-underline-offset:3px; }
@media(max-width:600px) {
    .poll-result { grid-template-columns:minmax(0,1fr) 4.5em 4.5em; gap:8px; padding:12px; }
    .poll-result-action:empty { display:none; }
    .poll-result-action:not(:empty) { grid-column:1/-1; }
    .poll-result-action a { padding-inline:0; }
}
.poll-close { margin-top:16px; }
.poll-status:not([hidden]) { padding:12px; background:var(--sage); border-radius:8px; color:var(--green); }
.poll-delete { margin-top:14px; font-size:var(--text-small); color:var(--muted); }
.poll-delete summary { cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.poll-heading-meta { display:flex; flex-wrap:wrap; gap:4px 12px; color:var(--muted); font-size:var(--text-small); font-weight:500; line-height:1.5; }

.poll-image-help { display: none; color: var(--muted); font-size: var(--text-small); }
.poll-composer[data-answer-style=image] .poll-image-help { display: block; }
.poll-composer[data-answer-style=image] [data-poll-composer-target=answers], .poll-card--image fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.poll-composer[data-answer-style=image] .poll-answer-editor { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; align-content: start; }
.poll-answer-upload { grid-column: 1 / -1; position: relative; display: grid; place-items: center; align-content: center; gap: 8px; min-height: 180px; padding: 10px; border: 1px dashed var(--green); border-radius: 10px; background: var(--surface); color: var(--green); cursor: pointer; font-size: var(--text-small); overflow: hidden; }
.poll-answer-upload:focus-within { outline: 2px solid var(--green); outline-offset: 2px; }
.poll-answer-upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.poll-answer-upload img { width: 100%; height: 180px; object-fit: contain; }
.poll-answer-upload span { text-align: center; }
.poll-card--image .poll-option { display: grid; grid-template-columns: 18px minmax(0, 1fr); align-content: start; gap: 8px; margin: 0; }
.poll-card--image .poll-option-image { grid-column: 1 / -1; grid-row: 1; width: 100%; height: clamp(150px, 25vw, 290px); object-fit: contain; position: relative; z-index: 1; }
.poll-card--image .poll-option strong { grid-column: 2; }
.poll-card--emoji .poll-option-emoji { display: inline-block; font-size: 2rem; }
.poll-composer[data-answer-style=emoji] .poll-answer-emoji { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; font-size: 2rem; }
@media (max-width: 600px) {
    .poll-composer { padding: 12px; }
    .poll-answer-upload { min-height: 150px; }
    .poll-answer-upload img { height: 140px; }
}

.poll-composer[data-answer-style=image] .poll-answer-remove { position: absolute; top: 6px; right: 6px; z-index: 2; width: 30px; height: 30px; line-height: 1; border-radius: 50%; background: var(--surface); border: 1px solid var(--line); }