/* Component: Activations grid */
.cell {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	padding: var(--pfse-spacing-2);
	background: var(--pfse-surface-secondary);
	border: 1px solid var(--pfse-border-secondary);
	border-radius: var(--pfse-radius-md);
	text-align: left;
	font-size: 15px;
	line-height: var(--pfse-line-height-body);
	transition:
		background var(--pfse-anim-swift) var(--pfse-ease-standard),
		outline var(--pfse-anim-instant) var(--pfse-ease-standard),
		box-shadow var(--pfse-anim-swift) var(--pfse-ease-standard);
}
.cell--selected { outline: 2px solid var(--pfse-accent-primary); }
.cell--inactive { background: var(--pfse-surface-secondary); }
.cell--active { background: color-mix(in srgb, var(--pfse-success) 18%, var(--pfse-surface-secondary) 82%); }
.cell--focused { box-shadow: 0 0 0 2px var(--pfse-accent-primary) inset; }
.cell--solo { box-shadow: 0 0 0 2px var(--pfse-accent-primary) inset; }

/* Optional zero state explicit (kept for clarity if logic assigns) */
.cell--zero { background: var(--pfse-surface-secondary); }

/* Container card for activation grid */
.activations-grid-card { background: var(--pfse-surface-primary); border: 1px solid var(--pfse-border-secondary); border-radius: var(--pfse-radius-lg); padding: var(--pfse-spacing-4); display: flex; flex-direction: column; gap: var(--pfse-spacing-3); }
.activations-grid-header { font-size: var(--pfse-font-size-h3); font-weight: 600; letter-spacing: .5px; color: var(--pfse-text-high); text-shadow:0 1px 2px rgba(0,0,0,0.45); }

/* Pager refinement */
.pager-shell{display:flex; flex-direction:column; align-items:center; width:100%}
.pager-row-main{justify-content:center}
.pager-input-wrap{display:flex; flex-direction:column; align-items:center; gap:4px}
.pager-input{width:60px; background:var(--pfse-surface-primary); border:1px solid var(--pfse-border-secondary); border-radius:6px; padding:6px 10px; font-size:15px; text-align:center; color:var(--pfse-text-high); text-shadow:0 1px 2px rgba(0,0,0,0.55)}
.pager-caption{font-size:12px; color:var(--pfse-text-muted); letter-spacing:.3px; text-shadow:0 1px 2px rgba(0,0,0,0.35)}
.pager-btn{min-width:48px; font-size:18px}

/* Clear button greyscale */
.btn-clear-grey{filter:grayscale(100%);}

/* Improve number readability inside cells */
.cell-index,.cell-prime{color:var(--pfse-text-high); text-shadow:0 1px 2px rgba(0,0,0,0.55)}
.coeff-input{color:var(--pfse-text-high); text-shadow:0 1px 2px rgba(0,0,0,0.55)}
.coeff-input--heading{font-size:26px; font-weight:600; text-align:center; letter-spacing:.6px; padding:6px 10px;}

/* Differentiation: prime vs index */
.cell-index--util{opacity:.75; font-weight:500;}
.cell-prime--primary{font-weight:600; letter-spacing:.5px;}

/* Editable input affordance */
.coeff-input--editable {
	cursor: text;
	background: var(--pfse-surface-primary);
	border: 1px solid var(--pfse-border-secondary);
	padding: 4px 8px;
	border-radius: 6px;
	transition:
		background var(--pfse-anim-micro) var(--pfse-ease-standard),
		box-shadow var(--pfse-anim-micro) var(--pfse-ease-standard);
}
.coeff-input--editable:hover {
	background: var(--pfse-surface-secondary);
}
.coeff-input--editable:focus {
	outline: none;
	box-shadow: 0 0 0 2px var(--pfse-accent-primary);
}

/* Zero button (numeric reset) */
.coeff-zero-btn{min-width:48px; font-size:18px; font-weight:600; background:var(--pfse-surface-primary); border:1px solid var(--pfse-border-secondary); border-radius:8px; color:var(--pfse-text-high); text-shadow:0 1px 2px rgba(0,0,0,0.6);}
.coeff-zero-btn:hover{background:var(--pfse-surface-secondary);}
.coeff-zero-btn:active{background:color-mix(in srgb, var(--pfse-accent-primary) 15%, var(--pfse-surface-secondary));}

/* High-contrast icons inside activation buttons */
.activation-card .btn-activ span[aria-hidden="true"],
.activation-card .coeff-zero-btn span[aria-hidden="true"]{
	color:var(--pfse-text-high);
	text-shadow:0 1px 2px rgba(0,0,0,0.6);
}

/* Optional caption slot if added later */
.coeff-zero-caption{font-size:11px; color:var(--pfse-text-muted); letter-spacing:.4px;}

/* Disabled activation button */
.activation-card .btn-disabled{opacity:.4; cursor:not-allowed; filter:grayscale(40%);} 

/* Glow for unmute action: highlight mute button when cell is muted (aria-pressed=true) */
.activation-card.cell--muted .btn-activ[aria-pressed="true"]{
	background: color-mix(in srgb, var(--pfse-accent-primary) 35%, var(--pfse-surface-primary) 65%);
	box-shadow: 0 0 0 2px var(--pfse-accent-primary), 0 0 8px 2px rgba(0,0,0,0.6);
	border-color: var(--pfse-accent-primary);
	color: var(--pfse-text-high);
}
.activation-card.cell--muted .btn-activ[aria-pressed="true"] span[aria-hidden="true"]{ text-shadow:0 1px 3px rgba(0,0,0,0.7); }

/* Viewport: remove explicit scrolling; allow content to size naturally */
.scroll-viewport{overflow:visible;}

/* Prime metallic banner */
.prime-banner{display:flex; width:100%; align-items:center; justify-content:center; padding:6px 10px; border-radius:10px; position:relative; background:linear-gradient(135deg, hsl(var(--prime-hue) var(--prime-sat,70%) 55%) 0%, hsl(var(--prime-hue) calc(var(--prime-sat,70%) + 10%) 48%) 40%, hsl(var(--prime-hue) calc(var(--prime-sat,70%) + 25%) 42%) 100%); box-shadow:0 2px 6px rgba(0,0,0,.55), inset 0 0 8px rgba(255,255,255,.18); overflow:visible; cursor:pointer; border:2px solid transparent; transition:box-shadow 160ms ease, border-color 160ms ease;}
.prime-banner:hover{box-shadow:0 3px 10px rgba(0,0,0,.6), inset 0 0 10px rgba(255,255,255,.25);}
.prime-banner:focus{outline:none; box-shadow:0 0 0 3px var(--pfse-accent-primary), 0 3px 10px rgba(0,0,0,.65);}
.prime-banner--muted{background:linear-gradient(135deg, hsl(var(--prime-hue) 20% 25%) 0%, hsl(var(--prime-hue) 25% 20%) 40%, hsl(var(--prime-hue) 30% 15%) 100%); border-color:hsl(var(--prime-hue) 80% 45%); box-shadow:0 0 0 2px hsl(var(--prime-hue) 80% 45%), 0 2px 6px rgba(0,0,0,.7), inset 0 0 4px rgba(255,255,255,.15);}
.prime-banner:before{content:""; position:absolute; inset:0; border-radius:10px; background:linear-gradient(75deg, rgba(255,255,255,.3) 0%, rgba(255,255,255,0) 40%, rgba(255,255,255,.25) 70%, rgba(255,255,255,0) 100%); pointer-events:none;}
.prime-number{font-size:40px; font-weight:800; letter-spacing:1px; line-height:1; color:#fff; text-shadow:0 3px 8px rgba(0,0,0,.75), 0 0 12px rgba(0,0,0,.6); position:relative; top:2px;}

/* Theta Window subsection (tw-*) */
.theta-window-section{gap:var(--pfse-spacing-3);}
.tw-label{font-size:13px; font-weight:600; letter-spacing:.4px; color:var(--pfse-text-muted); margin:0 0 4px;}
.tw-sublabel{font-size:12px; font-weight:500; letter-spacing:.3px; color:var(--pfse-text-muted); margin:0 0 4px;}
.tw-select{width:100%; background:var(--pfse-surface-primary); border:1px solid var(--pfse-border-secondary); border-radius:var(--pfse-radius-md); padding:6px 10px; color:var(--pfse-text-high); font-size:14px;}
.tw-select:focus{outline:none; box-shadow:0 0 0 2px var(--pfse-accent-primary);} 
.tw-bounds-row{display:flex; gap:var(--pfse-spacing-2);}
.tw-bounds-col{flex:1; display:flex; flex-direction:column;}
.tw-input{background:var(--pfse-surface-primary); border:1px solid var(--pfse-border-secondary); border-radius:var(--pfse-radius-md); padding:6px 8px; font-size:14px; color:var(--pfse-text-high);}
.tw-input:focus{outline:none; box-shadow:0 0 0 2px var(--pfse-accent-primary);} 
.tw-input[disabled]{opacity:.55; cursor:not-allowed;}
.tw-input-invalid{border-color:var(--pfse-danger);} 
.tw-error{min-height:18px; font-size:12px; color:var(--pfse-danger); margin-top:2px; letter-spacing:.3px;}
.tw-error:not(.visible){visibility:hidden;}
.tw-hint{font-size:12px; color:var(--pfse-text-muted); margin-top:2px; letter-spacing:.3px;}



.trace-shade-editor.rail-card,
.growth-knobs-card {
background:var(--pfse-surface-primary); border:1px solid var(--pfse-border-secondary); border-radius:8px; padding:10px; display:flex; flex-direction:column; gap:8px; position:relative; min-height:140px
}


