.demo-lab{padding-block:var(--space-20)}
.lab{display:grid;grid-template-columns:.9fr 1.35fr .95fr;gap:var(--space-6);align-items:start}
.lab-column{min-width:0}
.lab-step{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:1.2px;font-weight:600;color:var(--muted);margin-bottom:var(--space-4)}
.lab-step span{color:var(--gold-text)}
.idea-list{display:flex;flex-direction:column;gap:var(--space-3)}
.idea-card{position:relative;text-align:left;display:flex;flex-direction:column;gap:var(--space-3);width:100%;padding:var(--space-5);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);transition:border-color 250ms ease,box-shadow 250ms ease,transform 250ms ease}
.idea-card:hover{border-color:rgba(192,160,98,.5);transform:translateY(-2px)}
.idea-card.active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 20px 45px -30px rgba(128,99,46,.45)}
.idea-card.active::before{content:"";position:absolute;left:-1px;top:var(--space-5);bottom:var(--space-5);width:3px;background:var(--gold);border-radius:0 3px 3px 0}
.idea-source{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:1px;color:var(--gold-text);font-weight:600}
.idea-quote{font-family:var(--font-display);font-size:var(--text-base);line-height:1.5;color:var(--ink)}
.idea-status{font-size:var(--text-xs);color:var(--muted)}
.lab-note{font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-5);line-height:1.6}
.draft-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5) var(--space-5);box-shadow:var(--shadow);touch-action:pan-y;user-select:text;transition:box-shadow 250ms ease}
.draft-card:focus-visible{outline-offset:3px}
.draft-card[data-swipe="approve"]{box-shadow:0 0 0 2px var(--gold),var(--shadow)}
.draft-card[data-swipe="skip"]{box-shadow:0 0 0 2px rgba(26,26,26,.35),var(--shadow)}
.channel-tabs{display:flex;gap:var(--space-1);border-bottom:1px solid var(--border);margin:0 calc(-1 * var(--space-5)) var(--space-4);padding:0 var(--space-3)}
.channel-tab{display:flex;align-items:center;gap:var(--space-2);min-height:48px;padding:var(--space-2) var(--space-3);font-size:var(--text-sm);color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color 200ms ease,border-color 200ms ease}
.channel-tab.active{color:var(--ink);border-bottom-color:var(--gold)}
.channel-dot{width:8px;height:8px;border-radius:50%;background:rgba(26,26,26,.15);transition:background 250ms ease}
.channel-dot[data-state="approved"],.channel-dot[data-state="edited"]{background:var(--gold)}
.channel-dot[data-state="rewrite"]{background:var(--gold-text);box-shadow:inset 0 0 0 2px var(--surface)}
.channel-dot[data-state="skipped"]{background:rgba(26,26,26,.45)}
.draft-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}
.draft-label{font-size:var(--text-xs);font-weight:600;color:var(--ink)}
.draft-state{font-size:var(--text-xs);padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);background:var(--muted-surface);color:var(--muted);white-space:nowrap;transition:background 250ms ease,color 250ms ease}
.draft-state[data-state="approved"],.draft-state[data-state="edited"]{background:rgba(192,160,98,.22);color:var(--gold-text)}
.draft-state[data-state="rewrite"]{background:rgba(128,99,46,.12);color:var(--gold-text)}
.draft-state[data-state="skipped"]{background:rgba(26,26,26,.08);color:var(--ink)}
.draft-subject{font-size:var(--text-sm);font-weight:600;margin-bottom:var(--space-2)}
.draft-text{touch-action:pan-y;display:block;width:100%;min-height:300px;resize:vertical;border:1px solid transparent;border-radius:var(--radius-sm);padding:var(--space-3);background:var(--paper);color:var(--ink);font-size:var(--text-sm);line-height:1.7;transition:border-color 200ms ease,background 200ms ease}
.draft-text:read-only{cursor:default}
.lab[data-editing="true"] .draft-text{border-color:var(--gold);background:var(--surface)}
.rewrite-box{margin-top:var(--space-4);display:grid;grid-template-columns:1fr auto;gap:var(--space-2) var(--space-3);align-items:center}
.rewrite-box label{grid-column:1 / -1;font-size:var(--text-xs);color:var(--muted)}
.rewrite-box input{min-height:44px;padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font-size:var(--text-sm)}
.rewrite-box input:focus-visible{border-color:var(--gold)}
.swipe-hint{display:none;justify-content:space-between;margin-top:var(--space-3);font-size:var(--text-xs);color:var(--muted)}
.draft-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2);margin-top:var(--space-4)}
.lab-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:48px;padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-pill);font-size:var(--text-sm);font-weight:600;background:var(--surface);color:var(--ink);transition:transform 180ms ease,background 180ms ease,border-color 180ms ease}
.lab-button:hover:not(:disabled){transform:translateY(-1px);border-color:rgba(192,160,98,.6)}
.lab-button:disabled{opacity:.45}
.lab-button-gold{background:var(--gold);border-color:var(--gold);color:#1a1a1a}
.lab-button-gold:hover:not(:disabled){background:#cdb17d}
.lab-button kbd{font-family:var(--font-body);font-size:var(--text-xs);font-weight:500;padding:1px 6px;border-radius:4px;border:1px solid rgba(26,26,26,.18);color:var(--muted);background:rgba(255,255,255,.55)}
.lab-button-gold kbd{color:#1a1a1a;border-color:rgba(26,26,26,.25)}
.lab-hint{font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-3);min-height:1.6em}
.queue-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3)}
.queue-progress{font-size:var(--text-xs);font-weight:600;color:var(--gold-text);white-space:nowrap;margin-bottom:var(--space-4)}
.queue-list{list-style:none;margin:0;padding:0;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);overflow:hidden}
.queue-item{border-bottom:1px solid var(--border);position:relative}
.queue-item:last-child{border-bottom:0}
.queue-item[data-current="true"]{background:var(--muted-surface)}
.queue-item[data-current="true"]::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold)}
.queue-open{display:grid;grid-template-columns:1fr auto;gap:var(--space-1) var(--space-3);width:100%;text-align:left;padding:var(--space-3) var(--space-4);min-height:56px;align-items:center}
.queue-open:hover{background:var(--muted-surface)}
.queue-idea{font-size:var(--text-xs);color:var(--muted)}
.queue-channel{font-size:var(--text-sm);font-weight:600;grid-row:2}
.queue-state{grid-column:2;grid-row:1 / span 2;font-size:var(--text-xs);padding:var(--space-1) var(--space-2);border-radius:var(--radius-pill);background:rgba(26,26,26,.05);color:var(--muted);white-space:nowrap;transition:background 250ms ease,color 250ms ease}
.queue-item[data-state="approved"] .queue-state,.queue-item[data-state="edited"] .queue-state{background:rgba(192,160,98,.22);color:var(--gold-text)}
.queue-item[data-state="rewrite"] .queue-state{background:rgba(128,99,46,.12);color:var(--gold-text)}
.queue-item[data-state="skipped"] .queue-state{background:rgba(26,26,26,.09);color:var(--ink)}
.queue-note{display:block;font-size:var(--text-xs);color:var(--muted);padding:0 var(--space-4) var(--space-3)}
.queue-tools{display:flex;gap:var(--space-4);margin-top:var(--space-3)}
.lab-link{min-height:44px;font-size:var(--text-xs);color:var(--gold-text);text-decoration:underline;text-underline-offset:3px}
.lab-link:disabled{color:var(--muted);text-decoration:none;opacity:.6}
.queue-done{margin-top:var(--space-5);padding:var(--space-5);border:1px solid rgba(192,160,98,.4);border-radius:var(--radius-md);background:var(--muted-surface)}
.queue-done p{font-size:var(--text-sm);color:var(--ink);margin-bottom:var(--space-4)}
.queue-done .primary-button{min-height:48px;gap:var(--space-4);padding-inline:var(--space-6)}
@media(max-width:1100px){
  .lab{grid-template-columns:1fr 1fr}
  .lab-review{grid-column:1 / -1;grid-row:1}
  .lab-ideas{grid-row:2}.lab-queue{grid-row:2}
}
@media(max-width:720px){
  .demo-lab{padding-block:var(--space-12)}
  .lab{grid-template-columns:1fr;gap:var(--space-8)}
  .lab-review,.lab-ideas,.lab-queue{grid-column:auto;grid-row:auto}
  .lab-ideas{order:1}.lab-review{order:2}.lab-queue{order:3}
  .idea-list{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)}
  .idea-card{padding:var(--space-4);gap:var(--space-2)}
  .idea-quote{font-size:var(--text-sm);display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
  .swipe-hint{display:flex}
  .draft-text{min-height:240px}
  .draft-actions{grid-template-columns:1fr 1fr}
  .channel-tabs{margin-inline:calc(-1 * var(--space-4));padding-inline:var(--space-2)}
  .draft-card{padding:var(--space-3) var(--space-4) var(--space-4)}
  .channel-tab{padding-inline:var(--space-2);font-size:var(--text-xs)}
}
@media(max-width:360px){.idea-list{grid-template-columns:1fr}.lab-button kbd{display:none}}

/* v11: staged, centered demo */
.lab{display:flex;flex-direction:column;gap:var(--space-10);max-width:760px;margin:0 auto}
.lab-column{width:100%}
.lab-step,.lab-note,.lab-hint{justify-content:center;text-align:center}
.lab-step{margin-bottom:var(--space-4)}
.lab-ideas .idea-list{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.lab[data-stage="1"] .lab-review,.lab[data-stage="1"] .lab-queue,.lab[data-stage="2"] .lab-queue{display:none}
.lab-column.is-revealed{animation:labIn .55s cubic-bezier(.2,.7,.2,1) both}
@keyframes labIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
[data-motion="off"] .lab-column.is-revealed{animation:none}
.queue-head{justify-content:center;gap:var(--space-4)}
.queue-tools{justify-content:center}
.queue-done{text-align:center}
.lab[data-stage="1"] .lab-note::after{content:" Click one to see the drafts.";color:var(--ink)}
@media(max-width:720px){.lab{gap:var(--space-8)}.lab-ideas .idea-list{grid-template-columns:1fr 1fr;gap:var(--space-2)}}
@media(max-width:360px){.lab-ideas .idea-list{grid-template-columns:1fr}}
.lab-button-gold{background:linear-gradient(180deg,#b08a4e,#8f7040);color:#fff;border-color:transparent}
.lab-button-gold kbd{background:rgba(255,255,255,.18);color:#fff;border-color:rgba(255,255,255,.35)}
.lab-button-gold:hover{filter:brightness(1.07);color:#fff}