/* SERP Simulator v2.0 — directoryforai.com */
#dss,#dss *{box-sizing:border-box;margin:0;padding:0}
#dss{
  --sf:#fff;--sf2:#f4f4f1;--sf3:#eeede9;
  --ink:#111110;--ink2:#48473f;--ink3:#8a8880;--ink4:#b8b6ae;
  --ac:#0f62fe;--ac-s:#eef3ff;--ac-b:#c7d7ff;
  --gr:#16a34a;--gr-s:#f0fdf4;
  --bd:rgba(17,17,16,.08);--bdm:rgba(17,17,16,.14);--bds:rgba(17,17,16,.22);
  --r:8px;--rl:12px;--rx:16px;
  --sh:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  --sh2:0 4px 16px rgba(0,0,0,.07),0 1px 3px rgba(0,0,0,.05);
  --red:#dc2626;--red-s:#fef2f2;--red-b:#fecaca;
  font-family:'DM Sans',sans-serif;
  max-width:880px;
  margin:0 auto;
  padding:0 0 3rem;
  color:var(--ink);
}

/* HERO */
#dss .dss-hero{background:var(--sf);border:1px solid var(--bd);border-radius:var(--rx);padding:2rem 1.5rem 1.75rem;text-align:center;margin-bottom:1rem}
#dss .dss-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ac);background:var(--ac-s);border:1px solid var(--ac-b);border-radius:100px;padding:4px 12px;margin-bottom:1rem}
#dss .dss-badge span{width:6px;height:6px;background:var(--ac);border-radius:50%;display:inline-block;animation:dss-pulse 2s infinite}
@keyframes dss-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}
#dss .dss-hero h2{font-family:'Instrument Serif',serif;font-size:clamp(1.6rem,3vw,2.4rem);font-weight:400;line-height:1.15;letter-spacing:-.02em;color:var(--ink);margin-bottom:.5rem}
#dss .dss-hero h2 em{font-style:italic;color:var(--ink2)}
#dss .dss-hero p{font-size:.875rem;color:var(--ink3);max-width:480px;margin:0 auto .75rem}
#dss .dss-stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
#dss .dss-stat{font-size:11.5px;font-weight:500;color:var(--ink2);background:var(--sf2);border:1px solid var(--bd);border-radius:100px;padding:4px 12px;display:flex;align-items:center;gap:5px}
#dss .dss-dot{width:6px;height:6px;border-radius:50%;background:var(--gr);display:inline-block}

/* NAV TABS */
#dss .dss-nav{display:flex;gap:2px;background:var(--sf2);border-radius:var(--rl);padding:3px;margin-bottom:1rem;flex-wrap:wrap}
#dss .dss-nav-tab{flex:1;min-width:80px;font-family:'DM Sans',sans-serif;font-size:12.5px;font-weight:500;color:var(--ink3);background:none;border:none;border-radius:10px;padding:8px 6px;cursor:pointer;transition:all .15s;text-align:center;white-space:nowrap}
#dss .dss-nav-tab:hover{color:var(--ink)}
#dss .dss-nav-tab.active{background:var(--sf);color:var(--ink);box-shadow:var(--sh)}

/* PANELS */
#dss .dss-panel{display:none}
#dss .dss-panel.active{display:block}

/* CARDS */
#dss .dss-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--rx);padding:1.25rem 1.5rem;margin-bottom:1rem;box-shadow:var(--sh)}
#dss .dss-clabel{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin-bottom:.875rem;display:flex;align-items:center;gap:8px}
#dss .dss-clabel::after{content:'';flex:1;height:1px;background:var(--bd)}

/* QUERY INPUT */
#dss .dss-intent-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
#dss .dss-intent-btn{font-family:'DM Sans',sans-serif;font-size:11.5px;font-weight:500;color:var(--ink2);background:var(--sf2);border:1px solid var(--bd);border-radius:100px;padding:5px 12px;cursor:pointer;transition:all .15s}
#dss .dss-intent-btn:hover{border-color:var(--bds);background:var(--sf3);color:var(--ink)}
#dss .dss-qwrap{position:relative}
#dss #dss-q{width:100%;font-family:'DM Sans',sans-serif;font-size:1rem;color:var(--ink);background:var(--sf);border:1.5px solid var(--bdm);border-radius:var(--rl);padding:13px 50px 13px 16px;outline:none;transition:border-color .15s,box-shadow .15s;display:block}
#dss #dss-q:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(15,98,254,.1)}
#dss #dss-q::placeholder{color:var(--ink4)}
#dss .dss-qclear{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:50%;border:none;background:var(--sf3);color:var(--ink3);cursor:pointer;display:none;align-items:center;justify-content:center;font-size:13px;transition:background .15s}
#dss .dss-qclear:hover{background:var(--bdm)}
#dss .dss-qclear.vis{display:flex}

/* AUTOCOMPLETE */
#dss .dss-ac-drop{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--sf);border:1px solid var(--bdm);border-radius:var(--rl);box-shadow:var(--sh2);z-index:999;overflow:hidden;display:none}
#dss .dss-ac-drop.vis{display:block}
#dss .dss-ac-item{padding:9px 16px;font-size:13px;color:var(--ink2);cursor:pointer;transition:background .1s;font-family:'DM Sans',sans-serif}
#dss .dss-ac-item:hover{background:var(--sf2)}

/* TRANSLATE */
#dss .dss-xlat-row{display:none;align-items:center;gap:8px;margin-top:8px;padding:8px 12px;background:var(--sf2);border-radius:var(--r);border:1px solid var(--bd);flex-wrap:wrap}
#dss .dss-xlat-row.vis{display:flex}
#dss .dss-xlat-label{font-size:12px;color:var(--ink3)}
#dss .dss-xlat-result{font-size:13px;font-weight:500;color:var(--ink);flex:1}
#dss .dss-xlat-btn{font-size:11.5px;font-weight:500;color:var(--ac);background:none;border:1px solid var(--ac-b);border-radius:6px;padding:4px 10px;cursor:pointer;transition:all .15s;font-family:'DM Sans',sans-serif;white-space:nowrap}
#dss .dss-xlat-btn:hover{background:var(--ac-s)}

/* SEARCH TYPES */
#dss .dss-type-tabs{display:flex;gap:3px;background:var(--sf2);border-radius:var(--r);padding:3px;margin-top:10px}
#dss .dss-type-tab{flex:1;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;color:var(--ink3);background:none;border:none;border-radius:6px;padding:6px 4px;cursor:pointer;transition:all .15s;text-align:center;white-space:nowrap}
#dss .dss-type-tab.active{background:var(--sf);color:var(--ink);box-shadow:var(--sh)}

/* ENGINES */
#dss .dss-eng-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
#dss .dss-eng-btn{display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 8px;background:var(--sf);border:1px solid var(--bdm);border-radius:var(--rl);cursor:pointer;transition:all .15s;font-family:'DM Sans',sans-serif}
#dss .dss-eng-btn:hover{border-color:var(--bds);background:var(--sf2)}
#dss .dss-eng-btn.active{border-color:var(--ac);background:var(--ac-s);box-shadow:0 0 0 2px rgba(15,98,254,.12)}
#dss .dss-eico{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700}
#dss .dss-g-ico{font-size:17px;background:linear-gradient(135deg,#4285f4,#ea4335,#fbbc05,#34a853);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
#dss .dss-enm{font-size:11px;font-weight:500;color:var(--ink2)}
#dss .dss-eng-btn.active .dss-enm{color:var(--ac)}

/* GRIDS & FIELDS */
#dss .dss-g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#dss .dss-g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media(max-width:600px){#dss .dss-g2,#dss .dss-g3{grid-template-columns:1fr}}
#dss .dss-fld{display:flex;flex-direction:column;gap:5px}
#dss .dss-fld label{font-size:12px;font-weight:500;color:var(--ink2)}
#dss .dss-fld select,#dss .dss-fld input[type=text]{font-family:'DM Sans',sans-serif;font-size:13px;color:var(--ink);background:var(--sf);border:1px solid var(--bdm);border-radius:var(--r);padding:8px 12px;outline:none;transition:border-color .15s,box-shadow .15s;appearance:none;-webkit-appearance:none;cursor:pointer;width:100%}
#dss .dss-fld select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238a8880' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px}
#dss .dss-fld select:focus,#dss .dss-fld input[type=text]:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(15,98,254,.08)}
#dss .dss-opt{color:var(--ink4);font-weight:400}

/* TOGGLE BUTTONS */
#dss .dss-tg-group{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}
#dss .dss-tg-btn{font-family:'DM Sans',sans-serif;font-size:12.5px;font-weight:500;color:var(--ink2);background:var(--sf);border:1px solid var(--bdm);border-radius:var(--r);padding:7px 12px;cursor:pointer;transition:all .15s;white-space:nowrap}
#dss .dss-tg-btn:hover{border-color:var(--bds);background:var(--sf2)}
#dss .dss-tg-btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* PINS */
#dss .dss-pins{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
#dss .dss-pin-btn{font-size:13px;background:var(--sf);border:1px solid var(--bdm);border-radius:var(--r);padding:6px 12px;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:4px;font-family:'DM Sans',sans-serif}
#dss .dss-pin-btn:hover{border-color:var(--bds);background:var(--sf2)}
#dss .dss-pin-btn.active{border-color:var(--ac);background:var(--ac-s)}
#dss .dss-pin-name{font-size:11.5px;color:var(--ink2);font-weight:500}
#dss .dss-pin-row{display:flex;align-items:center;gap:8px;margin-top:8px}
#dss .dss-link-btn{font-family:'DM Sans',sans-serif;font-size:11.5px;font-weight:500;color:var(--ac);background:none;border:1px solid var(--ac-b);border-radius:6px;padding:4px 10px;cursor:pointer;transition:all .15s}
#dss .dss-link-btn:hover{background:var(--ac-s)}

/* ADVANCED */
#dss .dss-adv-toggle{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink3);cursor:pointer;border:none;background:none;font-family:'DM Sans',sans-serif;padding:0;transition:color .15s;margin-top:.75rem}
#dss .dss-adv-toggle:hover{color:var(--ink)}
#dss .dss-adv-toggle svg{transition:transform .2s}
#dss .dss-adv-toggle.open svg{transform:rotate(180deg)}
#dss .dss-adv-panel{display:none;margin-top:.875rem;padding-top:.875rem;border-top:1px solid var(--bd)}
#dss .dss-adv-panel.open{display:block}

/* TRENDS */
#dss .dss-trend-info{font-size:12px;color:var(--ink4);padding:4px 0}
#dss .dss-trend-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
#dss .dss-trend-chip{font-size:12px;font-weight:500;color:var(--ink2);background:var(--sf2);border:1px solid var(--bd);border-radius:100px;padding:5px 12px;cursor:pointer;transition:all .15s;font-family:'DM Sans',sans-serif;border:none}
#dss .dss-trend-chip{border:1px solid var(--bd)}
#dss .dss-trend-chip:hover{border-color:var(--bds);background:var(--sf3);color:var(--ink)}
#dss .dss-tag-new{background:var(--ac-s);color:var(--ac);border:1px solid var(--ac-b);border-radius:100px;font-size:10.5px;font-weight:600;padding:2px 8px;letter-spacing:.03em;margin-left:4px}

/* URL BOX */
#dss .dss-url-box{background:var(--sf2);border:1px solid var(--bd);border-radius:var(--r);padding:10px 14px;display:flex;align-items:center;gap:10px}
#dss .dss-url-txt{font-family:'DM Mono',monospace;font-size:11px;color:var(--ink3);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#dss .dss-url-copy{font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;color:var(--ac);background:none;border:1px solid var(--ac-b);border-radius:6px;padding:4px 10px;cursor:pointer;white-space:nowrap;transition:all .15s;flex-shrink:0}
#dss .dss-url-copy:hover{background:var(--ac-s)}
#dss .dss-url-copy.ok{color:var(--gr);border-color:#86efac;background:var(--gr-s)}

/* SHARE ROW */
#dss .dss-share-row{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
#dss .dss-share-btn{font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;color:var(--ink2);background:var(--sf);border:1px solid var(--bdm);border-radius:var(--r);padding:7px 14px;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:5px}
#dss .dss-share-btn:hover{border-color:var(--bds);background:var(--sf2)}
#dss .dss-share-btn.ok{color:var(--gr);border-color:#86efac;background:var(--gr-s)}

/* SEARCH BUTTON */
#dss .dss-sbtn{width:100%;font-family:'DM Sans',sans-serif;font-size:15px;font-weight:600;color:#fff;background:var(--ink);border:none;border-radius:var(--rl);padding:14px;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:.875rem}
#dss .dss-sbtn:hover{background:#2a2a28;transform:translateY(-1px);box-shadow:var(--sh2)}
#dss .dss-sbtn:active{transform:translateY(0)}
#dss .dss-hint{font-size:11.5px;color:var(--ink4);text-align:center;margin-top:.625rem}

/* HOW IT WORKS */
#dss .dss-divider{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink4);text-align:center;margin:1.25rem 0 .875rem;position:relative}
#dss .dss-divider::before,#dss .dss-divider::after{content:'';position:absolute;top:50%;width:38%;height:1px;background:var(--bd)}
#dss .dss-divider::before{left:0}#dss .dss-divider::after{right:0}
#dss .dss-how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:600px){#dss .dss-how-grid{grid-template-columns:1fr}}
#dss .dss-how-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--rl);padding:1rem 1.125rem;text-align:center}
#dss .dss-how-num{width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;margin:0 auto 8px}
#dss .dss-how-title{font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:3px}
#dss .dss-how-desc{font-size:11.5px;color:var(--ink3);line-height:1.5}

/* BULK */
#dss .dss-bulk-area{width:100%;font-family:'DM Sans',sans-serif;font-size:13px;color:var(--ink);background:var(--sf);border:1px solid var(--bdm);border-radius:var(--r);padding:10px 14px;outline:none;resize:vertical;min-height:120px;line-height:1.6;display:block}
#dss .dss-bulk-area:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(15,98,254,.08)}
#dss .dss-bulk-area::placeholder{color:var(--ink4)}

/* OPERATORS */
#dss .dss-op-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
@media(max-width:500px){#dss .dss-op-grid{grid-template-columns:1fr}}
#dss .dss-op-card{background:var(--sf2);border:1px solid var(--bd);border-radius:var(--r);padding:10px 12px}
#dss .dss-op-label{font-size:11px;font-weight:600;color:var(--ink3);letter-spacing:.06em;text-transform:uppercase;margin-bottom:5px}
#dss .dss-op-inp{width:100%;font-family:'DM Mono',monospace;font-size:12.5px;color:var(--ink);background:var(--sf);border:1px solid var(--bdm);border-radius:6px;padding:7px 10px;outline:none;transition:border-color .15s;display:block}
#dss .dss-op-inp:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(15,98,254,.08)}
#dss .dss-op-preview{font-family:'DM Mono',monospace;font-size:12px;color:var(--ink2);background:var(--sf2);border:1px solid var(--bd);border-radius:var(--r);padding:10px 14px;word-break:break-all;min-height:36px;line-height:1.6}

/* PRESETS & HISTORY */
#dss .dss-preset-list{display:flex;flex-direction:column;gap:6px}
#dss .dss-preset-item{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--sf2);border:1px solid var(--bd);border-radius:var(--r);cursor:pointer;transition:all .15s}
#dss .dss-preset-item:hover{background:var(--sf3);border-color:var(--bdm)}
#dss .dss-preset-name{font-size:13px;font-weight:500;color:var(--ink);flex:1}
#dss .dss-preset-meta{font-size:11.5px;color:var(--ink3)}
#dss .dss-preset-del{font-size:11px;color:var(--ink4);background:none;border:none;cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .15s;font-family:'DM Sans',sans-serif}
#dss .dss-preset-del:hover{color:var(--red);background:var(--red-s)}
#dss .dss-preset-empty,#dss .dss-hist-empty{text-align:center;padding:2rem;color:var(--ink4);font-size:13px}
#dss .dss-save-row{display:flex;gap:8px}
#dss .dss-save-inp{flex:1;font-family:'DM Sans',sans-serif;font-size:13px;color:var(--ink);background:var(--sf);border:1px solid var(--bdm);border-radius:var(--r);padding:8px 12px;outline:none;transition:border-color .15s}
#dss .dss-save-inp:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(15,98,254,.08)}
#dss .dss-save-btn{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:#fff;background:var(--ink);border:none;border-radius:var(--r);padding:8px 18px;cursor:pointer;transition:all .15s;white-space:nowrap}
#dss .dss-save-btn:hover{background:#2a2a28}
#dss .dss-export-row{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
#dss .dss-exp-btn{font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;color:var(--ink2);background:var(--sf);border:1px solid var(--bdm);border-radius:var(--r);padding:7px 14px;cursor:pointer;transition:all .15s}
#dss .dss-exp-btn:hover{border-color:var(--bds);background:var(--sf2)}
#dss .dss-exp-btn.dss-danger{color:var(--red)}
#dss .dss-exp-btn.dss-danger:hover{background:var(--red-s);border-color:var(--red-b)}
#dss .dss-hist-wrap{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;max-height:360px;overflow-y:auto}
#dss .dss-hist-item{display:flex;align-items:center;gap:8px;padding:9px 14px;border-bottom:1px solid var(--bd);cursor:pointer;transition:background .1s}
#dss .dss-hist-item:last-child{border-bottom:none}
#dss .dss-hist-item:hover{background:var(--sf2)}
#dss .dss-hist-q{font-size:13px;font-weight:500;color:var(--ink);flex:1}
#dss .dss-hist-meta{font-size:11.5px;color:var(--ink3);white-space:nowrap}
#dss .dss-hist-del{font-size:11px;color:var(--ink4);background:none;border:none;cursor:pointer;padding:2px 5px;border-radius:4px;transition:all .15s;font-family:'DM Sans',sans-serif}
#dss .dss-hist-del:hover{color:var(--red);background:var(--red-s)}

/* EMBED */
#dss .dss-embed-code{font-family:'DM Mono',monospace;font-size:11.5px;color:var(--ink2);background:var(--sf2);border:1px solid var(--bd);border-radius:var(--r);padding:12px 14px;word-break:break-all;white-space:pre-wrap;line-height:1.6}

/* UTILS */
#dss .dss-body-text{font-size:13px;color:var(--ink3);line-height:1.6}
#dss .dss-muted{font-size:12px;color:var(--ink4)}