/* One live group of eight voices around the fire, with room for real text. */
.ranking-note { margin:0; padding:0 22px 12px; color:var(--muted); font-size:12px; }
.ranking-note span { margin-left:12px; color:var(--dim); }
#board { height:auto; padding:16px 20px 26px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(3,minmax(140px,auto)); gap:32px 20px; }
#cards { display:contents; }
#cards .idea-card { position:relative; inset:auto!important; width:auto; max-width:none; min-width:0; height:auto; max-height:none; min-height:0; margin:0; padding:16px 14px 12px; display:flex; flex-direction:column; align-self:center; animation:none; transform:translate(var(--offset-x,0),var(--offset-y,0)); }
#cards .idea-card h2 { display:block; -webkit-line-clamp:unset; font-size:16px; line-height:1.6; word-break:normal; overflow-wrap:anywhere; white-space:normal; margin:0 0 12px; min-height:0; }
#cards .idea-card.new-card { padding-top:29px; }
#cards .card-bottom { flex:none; gap:5px; margin-top:auto; }
#cards .want-button { margin-left:auto; }
#cards [data-cell="0"] { grid-area:1/1; --offset-x:4px; --offset-y:10px; }
#cards [data-cell="1"] { grid-area:1/2; --offset-x:-3px; --offset-y:-3px; }
#cards [data-cell="2"] { grid-area:1/3; --offset-x:-4px; --offset-y:14px; }
#cards [data-cell="3"] { grid-area:2/1; --offset-x:-7px; --offset-y:0px; }
#cards [data-cell="5"] { grid-area:2/3; --offset-x:7px; --offset-y:3px; }
#cards [data-cell="6"] { grid-area:3/1; --offset-x:6px; --offset-y:-7px; }
#cards [data-cell="7"] { grid-area:3/2; --offset-x:3px; --offset-y:6px; }
#cards [data-cell="8"] { grid-area:3/3; --offset-x:-5px; --offset-y:-10px; }
#cards [data-cell="0"],#cards [data-cell="6"] { width:94%; justify-self:end; }
#cards [data-cell="1"],#cards [data-cell="7"] { width:90%; justify-self:center; }
#cards [data-cell="2"],#cards [data-cell="8"] { width:95%; justify-self:start; }
#cards [data-cell="3"] { width:97%; justify-self:start; }
#cards [data-cell="5"] { width:97%; justify-self:end; }
#board .fire-center { grid-area:2/2; position:relative; top:auto; left:auto; transform:none; width:var(--circle-fire-width,150px); max-width:80%; justify-self:center; align-self:center; opacity:1; }
#board .fire-art { height:auto; aspect-ratio:1.15; }
#board:has(.empty-state:not([hidden])) { min-height:440px; grid-template-rows:80px 220px 80px; }
#board .empty-state { bottom:6px; }
.voices-panel.list-view #board { display:block; height:auto; padding:16px 20px 24px; overflow:visible; }
.voices-panel.list-view #cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.voices-panel.list-view #cards .idea-card { grid-area:auto; transform:none; width:auto; justify-self:stretch; }
.presentation { height:auto!important; min-height:100dvh; }
.presentation main { flex:none; min-height:calc(100dvh - 64px); }
.presentation .workspace { flex:none; }
.presentation .voices-panel { height:auto; overflow:hidden; }
.presentation .ranking-note { padding:0 20px 6px; }
.presentation #board { padding-top:12px; padding-bottom:16px; row-gap:28px; }
.presentation #cards .idea-card { padding:clamp(12px,1vw,20px); }
.presentation #cards .idea-card h2 { font-size:clamp(18px,1.25vw,25px); line-height:1.5; margin-bottom:10px; }
.presentation #cards .want-count { font-size:14px; }
.presentation #cards .want-count strong { font-size:clamp(24px,1.8vw,34px); line-height:1; }
@media(min-width:761px) and (max-width:1190px) {
 body:not(.presentation) .workspace { grid-template-columns:minmax(0,1fr); }
 body:not(.presentation) .compose-panel { width:100%; }
 body:not(.presentation) .compose-panel textarea { min-height:126px; }
 .compose-heading-row { justify-content:flex-start; }
 .compose-heading-row h2 { flex:none; }
 .compose-description .desktop-only { display:none; }
 #board .fire-center { width:var(--circle-fire-width,150px); }
}
@media(min-width:761px) and (max-height:850px) {
 .site-header { height:64px; }
 main { padding-top:16px; }
 .page-intro { margin-bottom:14px; }
 .page-intro h1 { font-size:clamp(23px,2vw,30px); }
 .page-intro p { margin-top:5px; }
 .presentation main { padding-top:12px; }
 .presentation .screen-qr img { width:80px; height:80px; }
 .presentation .page-intro { margin-bottom:6px; }
 .presentation .screen-metric dt { font-size:16px; }
 .board-toolbar { height:48px; }
}
@media(max-width:760px) {
 .ranking-note { padding:0 0 4px; font-size:11px; }
 .ranking-note span { margin-left:8px; }
 #board { display:block; padding:0 0 10px; }
 #board .fire-center { width:170px; max-width:none; margin:22px auto 26px; }
 #cards,.voices-panel.list-view #cards { display:flex; flex-direction:column; gap:14px; }
 #cards .idea-card { width:100%; transform:none; padding:18px; }
 #cards .idea-card h2 { font-size:16px; }
 #cards .idea-card.new-card { padding-top:29px; }
 #board:has(.empty-state:not([hidden])) { min-height:400px; }
 .presentation main { min-height:0; padding-bottom:24px; }
 .presentation .ranking-note { padding:14px 0 0; }
 .presentation #cards .idea-card h2 { font-size:17px; }
 .presentation .screen-qr img { width:80px; height:80px; }
}