.magnet-picker{left:clamp(12px,22vw,290px);width:min(550px,calc(100vw - 32px));padding:20px;background:#fffef9;border:1px solid #e1e6d8;border-radius:18px;box-shadow:0 16px 60px #34442d24;max-height:calc(100vh - 165px);display:flex;flex-direction:column;gap:12px;overflow:hidden}
.magnet-picker[hidden]{display:none}.magnet-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.magnet-eyebrow{font-size:8px;letter-spacing:1.8px;color:#9eac89}.magnet-heading h2{margin:6px 0 0;font:25px/1.2 var(--serif);font-weight:400;color:#62754f}.magnet-heading h2 span{display:inline-block;vertical-align:middle;margin-left:6px;border:1px solid #dfe6d1;border-radius:20px;padding:4px 8px;font:10px var(--sans);color:#8c9d74}.magnet-close{font-size:24px;color:#9ca78b;width:32px;height:32px;border-radius:50%}.magnet-close:hover{background:#eff3e6}.magnet-search{display:flex;align-items:center;gap:9px;background:#f4f5ed;border:1px solid #e7eadd;border-radius:10px;padding:9px 12px;color:#8fa276}.magnet-search>span{font-size:23px;line-height:18px}.magnet-search input{min-width:0;width:100%;border:0;background:transparent;outline:0;font:11px var(--sans);color:#657553}.magnet-search:focus-within{border-color:#a9bb8c;box-shadow:0 0 0 3px #a9bb8c16}.magnet-search input::placeholder{color:#a3ac93}.magnet-search kbd{font:9px var(--sans);border:1px solid #dce2d0;border-radius:4px;padding:2px 4px;color:#a3ad92}.magnet-shortcuts{display:flex;gap:6px;border-bottom:1px solid #ebeddf;padding-bottom:11px}.magnet-shortcuts button{font-size:10px;padding:6px 11px;border-radius:7px;color:#8e9f78}.magnet-shortcuts button[aria-pressed=true]{background:#e7efda;color:#637f43}.magnet-shortcuts button span{font-size:9px;opacity:.7}.magnet-categories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;flex-shrink:0}.magnet-categories button{display:flex;align-items:center;gap:5px;padding:6px 5px;border:1px solid transparent;border-radius:7px;text-align:left;font:9px/1.3 var(--sans);color:#8c987b;min-height:30px}.magnet-categories button>span{font-size:15px;filter:drop-shadow(0 1px 1px #60694a25)}.magnet-categories button:hover{background:#f2f4e9}.magnet-categories button[aria-pressed=true]{border-color:#cfdcba;background:#edf3e3;color:#607a46}.magnet-results-heading{display:flex;align-items:center;justify-content:space-between;padding:2px 1px 0}.magnet-results-heading strong{font:14px var(--serif);color:#768963}.magnet-results-heading>span{font-size:9px;color:#a3ad94}.magnet-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;overflow-y:auto;min-height:110px;max-height:310px;padding:2px 4px 5px 1px;scrollbar-width:thin;scrollbar-color:#dce3ce transparent;align-content:start}.magnet-tile{position:relative;min-width:0;border-radius:11px;background:linear-gradient(145deg,#f8f9f1,#f0f3e8);border:1px solid #e9eddf}.magnet-option{display:flex;width:100%;height:81px;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:7px 3px;border-radius:10px;transition:background .16s;min-width:0}.magnet-option:hover{transform:none;background:#edf3dd}.magnet-preview{display:block;font:33px/1.2 "Segoe UI Emoji","Apple Color Emoji",sans-serif;filter:drop-shadow(1px 3px 1px #7f805729);transition:transform .18s}.magnet-option:hover .magnet-preview{transform:translateY(-3px) rotate(-7deg) scale(1.1)}.magnet-label{font:8px/1.2 var(--sans);text-align:center;color:#889876;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.magnet-favorite{position:absolute;right:2px;top:1px;width:20px;height:21px;font:16px/1 Georgia;color:#b6bda4;opacity:0;border-radius:5px}.magnet-tile:hover .magnet-favorite,.magnet-tile:focus-within .magnet-favorite,.magnet-favorite[aria-pressed=true]{opacity:1}.magnet-favorite[aria-pressed=true]{color:#c4a35e}.magnet-favorite:hover{background:#fffdf5}.magnet-footer{display:flex;justify-content:space-between;gap:10px;font-size:8px;color:#a1ad91;padding-top:8px;border-top:1px solid #ebeddf}.magnet-empty{grid-column:1/-1;padding:25px 10px;text-align:center;color:#9ca88b}.magnet-empty>span{display:block;font:30px Georgia;margin-bottom:10px;color:#c5cdaa}.magnet-empty strong{font:17px var(--serif)}.magnet-empty p{font:10px/1.6 var(--sans);margin:8px 0}.magnet-option.just-added .magnet-preview{animation:magnet-added .45s ease-out}@keyframes magnet-added{35%{transform:scale(.82)}70%{transform:scale(1.16)}100%{transform:scale(1)}}
@media(max-height:760px){.magnet-picker{gap:8px;padding:15px}.magnet-categories{gap:2px}.magnet-categories button{padding:4px;min-height:25px}.magnet-grid{max-height:240px}.magnet-option{height:68px}.magnet-preview{font-size:28px}}
@media(max-width:700px){.magnet-picker{left:12px;top:49px;max-height:calc(100dvh - 130px);width:calc(100vw - 40px)}.magnet-categories{grid-template-columns:repeat(3,minmax(0,1fr));max-height:155px;overflow:auto}.magnet-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-height:230px}.magnet-favorite{opacity:1}.magnet-footer{font-size:7px}}
@media(prefers-reduced-motion:reduce){.magnet-option.just-added .magnet-preview{animation:none}.magnet-preview{transition:none}}
@media(max-height:650px){.magnet-picker{gap:7px}.magnet-eyebrow{display:none}.magnet-categories{display:flex;overflow-x:auto;flex-wrap:nowrap;max-height:38px;min-height:34px;padding-bottom:4px}.magnet-categories button{flex:0 0 auto;padding:5px 8px}.magnet-grid{min-height:80px;max-height:none;flex:1}.magnet-heading h2{font-size:22px}.magnet-shortcuts{padding-bottom:7px}}