.tabs,.section-head,.actions{display:flex;gap:9px;align-items:center}.tabs{margin:25px 0}.tabs .active{background:var(--user-accent);font-weight:bold}.section-head{justify-content:space-between}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.link-card,.template-item,#templateForm{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}.link-card h3{font:23px Georgia,serif;margin:8px 0}.link-card p{color:var(--muted);min-height:38px}.link-card .actions{flex-wrap:wrap}.template-layout{display:grid;grid-template-columns:320px 1fr;gap:15px}.template-item{margin-bottom:9px;cursor:pointer}.template-item.active{background:var(--user-accent)}#templateForm label,dialog label{display:grid;gap:5px;margin:9px 0}.symbol-bar,.token-bar{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}.symbol-bar button{font-size:20px;padding:6px}.token-bar button{font-size:11px;padding:6px}dialog{border:0;border-radius:18px}dialog form{min-width:min(480px,86vw)}dialog menu{display:flex;justify-content:flex-end;gap:8px}@media(max-width:850px){.cards{grid-template-columns:1fr 1fr}.template-layout{grid-template-columns:1fr}}@media(max-width:550px){.cards{grid-template-columns:1fr}.section-head{align-items:flex-start}.section-head h2{font-size:22px}}
.template-item .actions{margin-top:12px;flex-wrap:wrap}.template-item .actions button{padding:7px 9px;font-size:12px}.queue-list article{display:flex;align-items:center;gap:8px;margin-top:8px;padding:9px;border:1px solid var(--line);border-radius:10px}html[data-theme="dark"] .link-card,html[data-theme="dark"] .template-item,html[data-theme="dark"] #templateForm{background:#18241f!important;color:#eef4ef!important;border-color:#526158!important}html[data-theme="dark"] .link-card h3,html[data-theme="dark"] .template-item h3{color:#fff!important}html[data-theme="dark"] .link-card p,html[data-theme="dark"] .link-card small,html[data-theme="dark"] .template-item small{color:#bdcbc4!important}html[data-theme="dark"] .template-item.active{background:color-mix(in srgb,var(--user-accent) 35%,#18241f)!important;outline:2px solid var(--user-accent)}

/* Message library actions are deliberately uniform so the purpose is obvious on mobile. */
.library-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:25px 0}.library-toolbar .tabs,.library-actions{display:flex;gap:9px;align-items:center;margin:0}.library-toolbar button,.link-card .actions button,.link-card .actions .action-button,.product-action{min-height:42px;padding:10px 14px;border:1px solid var(--line);border-radius:11px;background:var(--card);color:var(--ink);font:700 13px/1.1 inherit;text-decoration:none;cursor:pointer}.library-toolbar .tabs button.active,.library-actions button{background:var(--user-accent);color:#fff;border-color:var(--user-accent)}.section-help{max-width:760px;margin:6px 0 0;color:var(--muted);font-size:14px}.link-card{position:relative}.link-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.link-card h3{margin:12px 0 6px}.link-description{min-height:42px;margin:0 0 13px;line-height:1.45}.link-url{display:block;overflow-wrap:anywhere;margin-bottom:12px}.link-card .actions{align-items:stretch}.link-card .actions button:hover,.link-card .actions .action-button:hover,.library-toolbar button:hover{filter:brightness(1.08);border-color:var(--user-accent)}.product-action{background:var(--user-accent)!important;color:#fff!important;border-color:var(--user-accent)!important;white-space:nowrap}.product-summary{display:flex;align-items:baseline;gap:9px;margin:10px 0;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--muted)}.product-summary span{font-size:11px;text-transform:uppercase;letter-spacing:.08em}.product-summary strong{color:var(--theme-headline);font-size:17px}.product-summary small{margin-left:auto}.drag-handle{float:right;padding:4px 8px;border:1px dashed var(--line);border-radius:8px;color:var(--muted);font:800 12px/1 Consolas,monospace;cursor:grab}.template-item.dragging{opacity:.5}.template-item.drop-target{outline:3px solid var(--user-accent);outline-offset:3px}.template-brand{display:block}.template-description{margin:10px 0 5px;line-height:1.4;font-weight:700}.template-preview{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0;color:var(--muted);line-height:1.4}.editor-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:8px}.editor-heading h3{margin:5px 0}.editor-heading p{margin:0;color:var(--muted);font-size:13px}.editor-heading [role=status]{color:var(--muted);font-size:12px;text-align:right}.rich-email-body{min-height:260px;border:1px solid var(--line);border-radius:10px;padding:14px;background:var(--paper);color:var(--ink);overflow:auto;white-space:pre-wrap}.rich-email-body:focus{outline:3px solid #80d9ff;outline-offset:2px}html[data-theme=dark] .product-summary{background:#223029;color:#cbd8d0}html[data-theme=dark] .product-summary strong{color:#fff}html[data-theme=dark] .rich-email-body{background:#223029;color:#f7fbf8}html[data-theme=dark] .template-preview,html[data-theme=dark] .template-description,html[data-theme=dark] .editor-heading p,html[data-theme=dark] .editor-heading [role=status]{color:#cbd8d0}html[data-theme=light] .product-summary{background:#edf3ef}html[data-theme=light] .rich-email-body{background:#fff;color:#17231e}@media(max-width:760px){.library-toolbar{display:grid;gap:10px}.library-toolbar .tabs,.library-actions{width:100%}.library-toolbar .tabs button,.library-actions button{flex:1}.template-layout{display:flex;flex-direction:column}.template-layout #templateForm{order:-1}.editor-heading{display:block}.editor-heading [role=status]{display:block;margin-top:8px;text-align:left}.link-card .actions button,.link-card .actions .action-button{flex:1 1 42%}.product-action{font-size:12px;padding:9px 10px}}
.reply-context-menu{display:none;position:fixed;z-index:10000;gap:4px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:6px;box-shadow:0 12px 35px #0005}.reply-context-menu button{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--card);color:var(--ink);font:700 12px/1.1 inherit;text-align:left}.reply-context-menu button:hover{background:var(--user-accent);color:#fff;border-color:var(--user-accent)}html[data-theme=dark] .reply-context-menu,html[data-theme=dark] .reply-context-menu button{background:#18241f;color:#f2f7f4;border-color:#526158}
/* Email paper is independent of the application theme; authored child colors stay intact. */
html #templateForm #richEmailBody { background:#fff; color:#000; color-scheme:light; caret-color:#000; font:16px/1.5 Arial,sans-serif; }
html #templateForm #richEmailTools { display:flex; flex-flow:row wrap; align-items:center; gap:3px; padding:6px; margin:0; background:#f1f3f4; border:1px solid #747775; border-radius:6px; }
html #templateForm #richEmailTools[hidden] { display:none; }
html #templateForm #richEmailTools :is(button,label,select) { box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; flex:0 0 34px; width:34px; min-width:34px; height:34px; min-height:34px; margin:0; padding:5px; border:1px solid #747775; border-radius:4px; background:#fff!important; color:#202124!important; font:16px/1 Arial,sans-serif; position:relative; }
html #templateForm #richEmailTools select { flex-basis:90px; width:90px; font-size:12px; padding:3px; color-scheme:light; }
html #templateForm #richEmailTools select option { background:#fff!important; color:#202124!important; }
html #templateForm #richEmailTools label { border-bottom:3px solid #000; font-weight:bold; }
html #templateForm #richEmailTools input[type=color] { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
html #templateForm #richEmailTools svg { width:18px; height:18px; pointer-events:none; }
html #templateForm #richEmailTools button:hover { background:#dadce0; }
html #templateForm #richEmailTools :focus-visible,html #templateForm #richEmailTools label:focus-within { outline:2px solid #174ea6; outline-offset:1px; }
html #templateForm #richEmailTools .email-select-all { flex:0 0 auto; width:auto; min-width:86px; padding:5px 9px; font-size:12px; white-space:nowrap; }
@media(max-width:600px) { html #templateForm #richEmailTools { display:grid; grid-template-rows:repeat(2,34px); grid-auto-flow:column; grid-auto-columns:34px; grid-template-columns:90px; justify-content:start; overflow-x:auto; max-width:100%; } }
html #templateForm .template-image-picker:not([hidden]) { display:grid; grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); gap:6px; padding:8px; max-height:230px; overflow:auto; }
html #templateForm .template-image-picker button { display:grid; gap:4px; padding:6px; font-size:12px; }
html #templateForm .template-image-picker img { width:80px; height:60px; object-fit:contain; }
html #templateForm #richEmailBody img { max-width:100%; height:auto; }
html #templateForm,html #templateForm .grid,html #templateForm .grid > *,html #templateForm .email-template-editor { min-width:0; }
html #templateForm #richEmailTools { box-sizing:border-box; width:100%; }
html #templateForm #richEmailBody a { color:#0b57d0; }

/* Keep long libraries compact until the user chooses a specific item. */
.library-picker{display:grid;gap:5px;min-width:min(100%,320px);margin-left:auto;color:var(--muted);font-size:13px;font-weight:700}.library-picker select{width:100%;min-height:40px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit}.link-card>summary,.template-item>summary{display:block;cursor:pointer;list-style:none}.link-card>summary::-webkit-details-marker,.template-item>summary::-webkit-details-marker{display:none}.link-card>summary::after,.template-item>summary::after{content:'+';float:right;display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--line);border-radius:50%;color:var(--muted);font-weight:800}.link-card[open]>summary::after,.template-item[open]>summary::after{content:'-';color:var(--ink)}.link-card>summary small,.template-item>summary small{display:block;margin-top:5px;color:var(--muted);font-size:12px;font-weight:600}.link-card-body,.template-item-body{margin-top:12px}.template-item>summary h3{margin:8px 0 0}.template-item.active>summary small,.template-item.active>summary h3{color:inherit}@media(max-width:760px){.section-head{display:grid;grid-template-columns:1fr}.library-picker{margin-left:0}.link-card>summary,.template-item>summary{padding-right:4px}}

/* Clear Gmail-style labels and review-first AI/link dialogs. */
html #templateForm #richEmailTools :is(.email-inline-photo-button,.email-ai-toolbar-button,.email-labeled-tool,.email-color-control){flex:0 0 auto;width:auto;min-width:0;padding:5px 9px;gap:5px;font-size:12px;white-space:nowrap}
.email-toolbar-guide,.email-ai-helper{margin:7px 0 10px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink)}.email-toolbar-guide>summary,.email-ai-helper>summary{cursor:pointer;font-weight:800;color:var(--theme-headline,var(--ink))}.email-toolbar-guide p,.email-ai-helper p{line-height:1.45}
.email-ai-helper textarea{box-sizing:border-box;width:100%;min-height:82px;margin:8px 0;padding:10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#111;font:16px/1.4 Arial,sans-serif}.email-ai-actions,.email-ai-dialog-actions,.email-link-dialog form>div{display:flex;flex-wrap:wrap;gap:8px}.email-ai-actions button,.email-ai-dialog-actions button,.email-link-dialog button{min-height:42px;padding:9px 12px;border:1px solid #526158;border-radius:8px;background:#fff;color:#10251f;font-weight:800}.email-ai-actions .primary,.email-ai-dialog-actions .primary,.email-link-dialog .primary{background:#0b6f47;color:#fff;border-color:#0b6f47}.email-ai-status{min-height:1.4em;color:var(--muted)}
.email-ai-dialog,.email-link-dialog{box-sizing:border-box;width:min(680px,94vw);max-height:88dvh;overflow:auto;padding:18px;border:1px solid #66746d;border-radius:14px;background:#fff;color:#111}.email-ai-dialog::backdrop,.email-link-dialog::backdrop{background:#0009}.email-ai-preview{margin:12px 0;padding:13px;border:1px solid #8a918d;border-radius:9px;background:#f5f7f6;color:#111;white-space:pre-wrap;overflow-wrap:anywhere}.email-link-dialog label{display:grid;gap:6px;margin:10px 0;color:#111;font-weight:700}.email-link-dialog input{box-sizing:border-box;width:100%;min-height:44px;padding:9px;border:1px solid #66746d;border-radius:8px;background:#fff;color:#111;font-size:16px}
.library-filters{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr)) auto;gap:9px;align-items:end;margin:12px 0 16px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--card)}.library-filters label{display:grid;gap:5px;color:var(--muted);font-size:13px;font-weight:800}.library-filters select{box-sizing:border-box;width:100%;min-height:42px;padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--ink);font:inherit}.library-filters small{padding:10px 0;color:var(--muted);white-space:nowrap}@media(max-width:700px){.library-filters{grid-template-columns:1fr}.library-filters small{padding:0;white-space:normal}}
@media(max-width:600px){html #templateForm #richEmailTools{display:grid;grid-template-rows:repeat(2,34px);grid-auto-flow:column;grid-auto-columns:max-content;justify-content:start;overflow-x:auto;max-width:100%}html #templateForm #richEmailTools :is(.email-select-all,.email-inline-photo-button,.email-ai-toolbar-button){order:-2}.email-ai-actions button,.email-ai-dialog-actions button{width:100%}}
