/* All dimensions, paint and typography use the chat design scale. */
.elara-suggestions{width:100%;min-width:0;display:flex;flex-direction:column;gap:var(--sp1half);margin-block:var(--sp2);color:var(--ink);font-size:var(--fs-step--1);line-height:var(--lb-step--1)}
.elara-suggestions .suggestion-heading,.elara-suggestions .suggestion-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--sp1);flex-wrap:wrap}
.elara-suggestions .suggestion-heading strong{font-size:var(--fs-step-3);line-height:var(--lbh-step-3);font-weight:var(--w-semi);letter-spacing:var(--tr-snug)}
.suggestion-intro{display:flex;flex-direction:column;gap:var(--sp1)}
.suggestion-subtitle{color:var(--mut);font-size:var(--fs-step--1);line-height:var(--lb-step--1)}
.elara-suggestions .suggestion-filter{display:flex;align-items:center;gap:var(--sp1);color:var(--mut)}
.elara-suggestions select,.elara-suggestions button{font:inherit;color:var(--ink);border:var(--bw-hair) solid var(--line2);border-radius:0;background:var(--panel);min-height:var(--sp-tap);padding:var(--sp1) var(--sp1half);cursor:pointer}
.elara-suggestions .suggestion-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--card-min)),1fr));gap:var(--sp1half);padding:var(--sp-half)}
.elara-suggestions .suggestion-card{position:relative;display:grid;grid-template-rows:auto 1fr auto auto;justify-items:center;align-items:center;width:100%;text-align:center;gap:var(--sp1half);overflow-wrap:anywhere;padding:var(--sp3) var(--sp2);min-height:calc(var(--sp-tap) * 4);background:var(--panel);border-color:var(--line);transition:background var(--dur-base) var(--ease-std),border-color var(--dur-base) var(--ease-std)}
.elara-suggestions .suggestion-label{font-size:var(--fs-step-0);line-height:var(--lb-step-0);font-weight:var(--w-semi);text-align:center;width:100%}
.suggestion-category{display:flex;align-items:center;justify-content:center;gap:var(--sp1);font-size:var(--fs-step--2);line-height:var(--lb-step--2);color:var(--gold2);font-weight:var(--w-semi)}
body.light .suggestion-category{color:var(--gold)}
.suggestion-icon{display:inline-flex;width:var(--sp2);height:var(--sp2)}.suggestion-icon svg{width:100%;height:100%}
.suggestion-arrow{font-size:var(--fs-step-1);line-height:var(--lb-step-1);color:var(--mut)}
.elara-suggestions .suggestion-card:hover .suggestion-arrow,.elara-suggestions .suggestion-card:focus-visible .suggestion-arrow{color:var(--gold2)}
.elara-suggestions .suggestion-entry{display:block;min-width:0}
.elara-suggestions .suggestion-entry .suggestion-card{height:100%}
.elara-suggestions .suggestion-options{position:absolute;inset-block-start:0;inset-inline-end:0}
.elara-suggestions .suggestion-options summary{color:var(--mut);font-size:var(--fs-step-1)}
.elara-suggestions .suggestion-more{border-color:transparent;background:transparent;color:var(--gold2);font-weight:var(--w-semi)}
body.light .elara-suggestions .suggestion-more{color:var(--gold)}
.elara-suggestions .suggestion-footer{padding-inline:var(--sp-half)}
.elara-suggestions[data-surface="chat"] .suggestion-card{min-height:calc(var(--sp-tap) * 3)}
@media(max-width:640px){
 .elara-suggestions .suggestion-list{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc(100% - var(--sp3));overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--sp-half);scrollbar-width:thin;padding-bottom:var(--sp1)}
 .elara-suggestions .suggestion-entry{scroll-snap-align:start}
 .elara-suggestions .suggestion-heading strong{font-size:var(--fs-step-2);line-height:var(--lbh-step-2)}
}
@media(prefers-reduced-motion:reduce){.elara-suggestions .suggestion-card{transition:none}}
.elara-suggestions .suggestion-reason,.elara-suggestions .suggestion-count,.elara-suggestions .suggestion-status{font-size:var(--fs-step--2);line-height:var(--lb-step--2);color:var(--mut)}
.elara-suggestions .suggestion-reason{min-height:var(--lb-step--2)}
.elara-suggestions .suggestion-status{margin:0;overflow-wrap:anywhere}
.elara-suggestions .suggestion-status:empty{display:none}
.elara-suggestions button:hover{border-color:var(--gold2);background:var(--panel2)}
.elara-suggestions button:focus-visible,.elara-suggestions select:focus-visible{outline:var(--bw-rule) solid var(--gold2);outline-offset:var(--bw-rule)}
.elara-suggestions button:disabled{cursor:wait;color:var(--mut)}
.elara-suggestions [hidden]{display:none}
/* The composer must read as an input in either theme, including mobile. */
body .composer .pill{background:var(--panel);border:var(--bw-rule) solid var(--line2);padding:var(--sp1);border-radius:0;box-shadow:none}
body .composer .pill:focus-within{border-color:var(--gold2)}
body .composer textarea#inp{color:var(--ink);min-height:var(--sp-tap);background:transparent}
body .composer textarea#inp::placeholder{color:var(--mut);opacity:1}
body .composer #toolChips{display:flex;flex-wrap:wrap;overflow:visible;gap:var(--sp1);height:auto;max-height:none}
body .composer #toolChips .toolchip{min-height:var(--sp-tap);font-size:var(--fs-step--2);padding-inline:var(--sp1);flex-shrink:0}
body #createMenu{position:fixed;bottom:calc(var(--composer-h) + var(--sp1));right:var(--sp2);width:var(--card-min);min-width:0;max-width:calc(100vw - var(--sp4));max-height:calc(100dvh - var(--composer-h) - var(--sp8));overflow:auto;background:var(--panel);border:var(--bw-hair) solid var(--gold2);box-shadow:none;animation:none;z-index:var(--z-header)}
body #createMenu .cmhead{white-space:normal;color:var(--ink);font:inherit;font-size:var(--fs-step--1);line-height:var(--lb-step--1);letter-spacing:normal;text-transform:none;padding:var(--sp1) var(--sp2);margin:0}
body #createMenu button{color:var(--ink);min-height:var(--sp-tap);padding:var(--sp1) var(--sp2);gap:var(--sp-half)}
body #createMenu button b{font-size:var(--fs-step--1);font-weight:var(--w-bold)}
body #createMenu button span{font-size:var(--fs-step--2);color:var(--mut)}
body #createMenu button:hover{background:var(--panel2)}
