:root { color-scheme: light; --mint:#d7eee2; --paper:#fff9f1; --ink:#171717; --yellow:#fff0a7; --pink:#ffc4a6; --line:2px solid var(--ink); }
* { box-sizing:border-box; }
body { margin:0; background:var(--mint); color:var(--ink); font-family:"Bricolage Grotesque",sans-serif; font-size:1rem; line-height:1.5; }
button,input { font:inherit; }
button,a,input { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; color:inherit; }
button:disabled { cursor:wait; opacity:.65; }
a { color:inherit; }
:focus-visible { outline:3px solid #3156c8; outline-offset:5px; }
.page-shell { width:min(1240px,calc(100% - 3rem)); margin:auto; }
.topbar,.control-head,.section-head,.card-top,.brief-actions { flex-wrap:wrap; }
.board-controls > * { min-width:0; }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:1.5rem 0; border-bottom:var(--line); gap:1rem; }
.brand { display:flex; align-items:center; gap:.7rem; font-size:1.6rem; font-weight:800; letter-spacing:-.05em; text-decoration:none; }
.brand-mark { display:grid; place-items:center; background:var(--yellow); border:var(--line); border-radius:.65rem; width:2.4rem; height:2.4rem; font-size:1.5rem; letter-spacing:0; transform:rotate(-7deg); }
.account-note,.eyebrow,.generation-label,.range-scale,.card-number,.sources-note,footer { font-family:"IBM Plex Mono",monospace; }
.account-note { font-size:.875rem; }
.board-controls { display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:3rem; padding:2.5rem 0; }
.eyebrow { font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; margin:0 0 .65rem; }
h1 { font-size:clamp(2rem,4vw,3.5rem); line-height:1.04; font-weight:800; letter-spacing:-.045em; margin:0; }
.intro-copy { max-width:30rem; margin:1rem 0 1.25rem; }
.primary-button,.secondary-button { border:var(--line); border-radius:.75rem; padding:.7rem 1rem; font-weight:700; min-height:44px; }
.primary-button { background:var(--ink); color:var(--paper); box-shadow:3px 3px 0 #789f89; }
.primary-button span { margin-left:1rem; }
.secondary-button { background:var(--yellow); }
button:hover:not(:disabled) { filter:brightness(.96); }
.control-card { background:var(--yellow); border:var(--line); border-radius:1.5rem; padding:1.5rem; box-shadow:6px 6px 0 rgba(23,23,23,.13); }
.control-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; font-weight:700; }
.mode-chip { padding:.25rem .65rem; border:var(--line); border-radius:2rem; background:var(--paper); font-size:.875rem; }
input[type=range] { width:100%; accent-color:var(--ink); margin:1.4rem 0 .25rem; cursor:pointer; height:1.5rem; }
.range-scale { display:flex; justify-content:space-between; font-size:.75rem; }
#modeCopy { min-height:3rem; font-size:.875rem; margin:1rem 0; }
.category-group { display:flex; flex-wrap:wrap; gap:.5rem; }
.category-group button { border:var(--line); background:transparent; padding:.55rem .8rem; border-radius:2rem; font-size:.875rem; min-height:44px; }
.category-group button[aria-pressed=true] { background:var(--ink); color:white; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:1rem; border-top:var(--line); padding-top:1.5rem; }
h2 { font-size:1.7rem; line-height:1.15; letter-spacing:-.025em; margin:0; }
.generation-label { font-size:.75rem; border:1px solid; border-radius:2rem; padding:.4rem .7rem; text-align:center; }
.feedback { font-size:.875rem; min-height:1.5rem; margin:.8rem 0 1rem; }
.ideas-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.idea-card { background:var(--paper); border:var(--line); border-radius:1.25rem; display:flex; flex-direction:column; min-width:0; padding:1.25rem; box-shadow:3px 3px 0 rgba(23,23,23,.1); }
.idea-card:nth-child(3n+2) { background:#f5f6ca; }
.idea-card:nth-child(3n) { background:#fbe3d6; }
.card-top { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem; }
.card-number { font-size:.75rem; }
.score { font-size:.75rem; border:1px solid; border-radius:1rem; padding:.15rem .5rem; }
.idea-card h3 { font-size:1.4rem; line-height:1.15; margin:0 0 .75rem; letter-spacing:-.025em; overflow-wrap:anywhere; }
.idea-card p { margin:0 0 1rem; }
.why { font-size:.875rem; color:#484239; }
.source-tags { display:flex; flex-wrap:wrap; gap:.35rem; margin:auto 0 1rem; }
.source-tag { font-size:.75rem; background:#ffffff80; border-radius:.4rem; padding:.2rem .4rem; }
.card-actions { border-top:1px solid #17171730; padding-top:1rem; display:flex; flex-direction:column; gap:.75rem; }
.starter-prompt { font-size:.875rem; overflow-wrap:anywhere; }
.starter-prompt summary { cursor:pointer; min-height:44px; display:list-item; align-content:center; font-weight:700; }
.starter-prompt p { margin:.5rem 0; }
.vote-row { display:flex; gap:.5rem; }
.vote-button { display:flex; align-items:center; justify-content:center; gap:.45rem; border:1px solid #17171760; border-radius:.6rem; background:transparent; min-width:3rem; min-height:44px; padding:.4rem .65rem; }
.vote-button[aria-pressed=true] { background:var(--ink); color:white; }
.brief-actions { display:flex; gap:.5rem; }
.brief-actions button { flex:1; font-size:.875rem; padding:.6rem .4rem; }
.copy-button { background:transparent; }
.sources-panel { border:var(--line); padding:1rem 1.25rem; border-radius:1rem; margin-top:1.5rem; background:#ffffff55; }
.sources-panel summary { cursor:pointer; font-weight:700; min-height:30px; }
#signalCount { font-weight:400; font-size:.875rem; margin-left:.5rem; }
.sources-note { font-size:.75rem; line-height:1.7; }
.sources-panel ul { padding-left:1.25rem; }
.sources-panel li { margin-bottom:.5rem; overflow-wrap:anywhere; }
.sources-panel a { text-underline-offset:3px; }
.empty-state { grid-column:1/-1; border:var(--line); border-radius:1rem; padding:2rem; background:var(--paper); }
footer { padding:2rem 0; font-size:.75rem; text-align:center; }
@media (max-width:950px) { .board-controls { gap:1.5rem; } .ideas-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:640px) { .page-shell { width:calc(100% - 2rem); } .topbar { padding:1rem 0; } .brand { font-size:1.3rem; } .account-note { max-width:6rem; text-align:right; font-size:.75rem; } .board-controls { grid-template-columns:1fr; padding:1.75rem 0; } .control-card { padding:1.1rem; } .ideas-grid { grid-template-columns:1fr; } .section-head { align-items:start; } h2 { font-size:1.4rem; } .generation-label { max-width:9rem; } }
@media (max-width:640px) { .board-controls { gap:1rem; padding:1.25rem 0; } .board-intro .eyebrow,.intro-copy { display:none; } h1 { font-size:1.8rem; margin-bottom:1rem; } h1 br { display:none; } .control-card { padding:1rem; } .category-group { gap:.35rem; } .category-group button { padding:.4rem .55rem; } #modeCopy { min-height:0; margin:.6rem 0; } input[type=range] { margin:.7rem 0 .25rem; } }
@media (prefers-reduced-motion:no-preference) { button { transition:filter 120ms; } }
