*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --brand:#3C3FDE;--brand-dark:#2a2db8;--brand-darker:#1e2090;--brand-mid:#6366ef;
  --brand-50:#f0f0fe;--brand-100:#d4d5fb;--brand-200:#a9abf7;
  --slate-50:#f8fafc;--slate-100:#f1f5f9;--slate-200:#e2e8f0;
  --slate-300:#cbd5e1;--slate-400:#94a3b8;--slate-500:#64748b;
  --slate-600:#475569;--slate-700:#334155;--slate-800:#1e293b;--slate-900:#0f172a;
  --white:#fff;
  --green:#16a34a;--green-bg:#f0fdf4;--green-light:#bbf7d0;
  --orange:#ea580c;--orange-bg:#fff7ed;--orange-light:#fed7aa;
  --red:#e11d48;--red-bg:#fff1f2;--red-light:#fecdd3;
  --yellow:#ca8a04;--yellow-bg:#fefce8;--yellow-light:#fef08a;
  --radius-sm:8px;--radius-md:12px;--radius-lg:16px;
}
html{scroll-behavior:smooth}
body{font-family:'Poppins',sans-serif;background:var(--slate-50);color:var(--slate-800);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif}

/* NAV */
nav{position:sticky;top:0;z-index:200;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--slate-200);padding:0 2.5rem;height:66px;display:flex;align-items:center;justify-content:space-between}
.nav-logo{text-decoration:none;display:flex;align-items:center;gap:10px}
.nav-logo-mark{width:34px;height:34px;background:var(--brand);border-radius:8px;display:flex;align-items:center;justify-content:center}
.nav-logo-mark svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.nav-logo-text{font-family:'Space Grotesk',sans-serif;font-size:1rem;font-weight:700;color:var(--slate-900);letter-spacing:-.02em}
.nav-links{display:flex;align-items:center;gap:2rem;list-style:none}
.nav-links a{font-size:.875rem;font-weight:500;color:var(--slate-600);text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--brand)}
.nav-cta{background:var(--brand)!important;color:#fff!important;padding:9px 22px;border-radius:var(--radius-sm);font-weight:600!important}

/* HERO */
.tool-hero{background:linear-gradient(135deg,var(--brand-darker) 0%,var(--brand) 55%,var(--brand-mid) 100%);padding:52px 2rem 48px;text-align:center;position:relative;overflow:hidden}
.tool-hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:40px 40px;pointer-events:none}
.tool-hero-inner{position:relative}
.breadcrumb{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:18px}
.breadcrumb a{font-size:.75rem;color:rgba(255,255,255,.6);text-decoration:none}
.breadcrumb span{font-size:.75rem;color:rgba(255,255,255,.4)}
.tool-hero h1{font-size:clamp(1.7rem,4vw,2.5rem);font-weight:700;color:#fff;letter-spacing:-.03em;line-height:1.12;margin-bottom:12px}
.tool-hero h1 em{font-style:normal;color:#a5b4fc}
.tool-hero p{font-size:.95rem;color:rgba(255,255,255,.7);max-width:520px;margin:0 auto 28px;line-height:1.7}
.hero-badges{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.hero-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.85);font-size:.72rem;font-weight:500;padding:5px 12px;border-radius:100px}
.hero-badge svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* CRAWL INPUT */
.crawl-wrap{max-width:780px;margin:-28px auto 0;padding:0 2rem;position:relative;z-index:10}
.crawl-card{background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-lg);padding:24px;box-shadow:0 8px 40px rgba(0,0,0,.12)}
.crawl-row{display:flex;gap:10px;align-items:flex-start}
.crawl-input-wrap{flex:1;position:relative}
.crawl-prefix{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:.82rem;color:var(--slate-400);pointer-events:none;font-family:'Poppins',sans-serif}
#domainInput{width:100%;font-family:'Poppins',sans-serif;font-size:.9rem;padding:13px 14px 13px 58px;background:var(--slate-50);border:1.5px solid var(--slate-200);border-radius:var(--radius-md);color:var(--slate-800);outline:none;transition:border-color .2s,box-shadow .2s}
#domainInput:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(60,63,222,.1);background:var(--white)}
#domainInput::placeholder{color:var(--slate-400)}
.crawl-options{display:flex;gap:16px;margin-top:14px;align-items:center;flex-wrap:wrap}
.crawl-opt-label{font-size:.78rem;font-weight:500;color:var(--slate-600)}
.crawl-opt-select{font-family:'Poppins',sans-serif;font-size:.78rem;padding:6px 28px 6px 10px;background:var(--slate-50);border:1.5px solid var(--slate-200);border-radius:var(--radius-sm);color:var(--slate-700);outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;cursor:pointer;transition:border-color .2s}
.crawl-opt-select:focus{border-color:var(--brand);outline:none}
.crawl-btn{padding:13px 28px;background:var(--brand);color:#fff;font-family:'Space Grotesk',sans-serif;font-size:.9rem;font-weight:700;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px;white-space:nowrap;flex-shrink:0}
.crawl-btn:hover{background:var(--brand-dark);transform:translateY(-1px);box-shadow:0 6px 20px rgba(60,63,222,.3)}
.crawl-btn:disabled{background:var(--slate-300);cursor:not-allowed;transform:none;box-shadow:none}
.crawl-btn svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* PROGRESS */
.progress-wrap{margin-top:16px;display:none}
.progress-bar-track{height:6px;background:var(--slate-100);border-radius:3px;overflow:hidden}
.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-mid));border-radius:3px;transition:width .9s cubic-bezier(.22,.61,.36,1);width:0%}
.progress-status{font-size:.75rem;color:var(--slate-500);margin-top:6px;display:flex;align-items:center;gap:6px}
.progress-dot{width:7px;height:7px;border-radius:50%;background:var(--brand);animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}

/* MAIN AREA */
.main-wrap{max-width:1300px;margin:0 auto;padding:40px 2rem 64px}

/* STATS BAR */
.stats-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px}
.stat-card{background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-md);padding:16px 20px;display:flex;align-items:center;gap:14px}
.stat-icon{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.stat-icon svg{width:18px;height:18px;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.stat-val{font-family:'Space Grotesk',sans-serif;font-size:1.6rem;font-weight:700;color:var(--slate-900);letter-spacing:-.03em;line-height:1}
.stat-lbl{font-size:.72rem;color:var(--slate-400);margin-top:2px}

/* VIEW TABS */
.view-tabs{display:flex;gap:4px;background:var(--slate-100);border-radius:var(--radius-sm);padding:4px;width:fit-content;margin-bottom:24px}
.view-tab{font-family:'Space Grotesk',sans-serif;font-size:.8rem;font-weight:600;padding:8px 18px;border-radius:6px;border:none;background:transparent;color:var(--slate-500);cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:6px}
.view-tab svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.view-tab.active{background:var(--white);color:var(--brand);box-shadow:0 1px 4px rgba(0,0,0,.1)}

/* GRAPH VIEW */
#graphView{background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-lg);overflow:hidden;position:relative}
.graph-toolbar{padding:14px 18px;border-bottom:1px solid var(--slate-100);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.graph-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.graph-legend{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.legend-item{display:flex;align-items:center;gap:5px;font-size:.72rem;color:var(--slate-500)}
.legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.graph-action-btn{font-family:'Poppins',sans-serif;font-size:.74rem;font-weight:500;padding:6px 12px;border-radius:var(--radius-sm);border:1.5px solid var(--slate-200);background:var(--white);color:var(--slate-600);cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:5px}
.graph-action-btn svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.graph-action-btn:hover{border-color:var(--brand-200);color:var(--brand)}
#graphSvg{width:100%;height:680px;cursor:grab}
#graphSvg:active{cursor:grabbing}
.graph-tooltip{position:absolute;background:var(--slate-900);color:#fff;padding:8px 12px;border-radius:var(--radius-sm);font-size:.75rem;pointer-events:none;opacity:0;transition:opacity .15s;max-width:240px;z-index:100;line-height:1.5}
.graph-tooltip strong{font-family:'Space Grotesk',sans-serif;display:block;margin-bottom:2px}
.node-detail-panel{position:absolute;top:60px;right:16px;width:220px;background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-md);padding:16px;box-shadow:0 4px 20px rgba(0,0,0,.1);display:none;z-index:50}
.ndp-title{font-family:'Space Grotesk',sans-serif;font-size:.82rem;font-weight:700;color:var(--slate-900);margin-bottom:2px;word-break:break-all}
.ndp-url{font-size:.7rem;color:var(--slate-400);margin-bottom:12px;word-break:break-all}
.ndp-stat{display:flex;justify-content:space-between;font-size:.75rem;padding:5px 0;border-bottom:1px solid var(--slate-100)}
.ndp-stat:last-child{border:none}
.ndp-stat-label{color:var(--slate-500)}
.ndp-stat-val{font-family:'Space Grotesk',sans-serif;font-weight:700;color:var(--slate-800)}
.ndp-close{position:absolute;top:10px;right:10px;cursor:pointer;width:20px;height:20px;display:flex;align-items:center;justify-content:center;color:var(--slate-400);border:none;background:transparent;font-size:1rem;line-height:1}
.ndp-close:hover{color:var(--slate-700)}

/* TREE VIEW */
#treeView{display:none;background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-lg);overflow:hidden}
.tree-header{padding:14px 18px;border-bottom:1px solid var(--slate-100);display:flex;align-items:center;justify-content:space-between}
.tree-header-title{font-family:'Space Grotesk',sans-serif;font-size:.88rem;font-weight:700;color:var(--slate-800)}
.tree-search{font-family:'Poppins',sans-serif;font-size:.78rem;padding:7px 12px;border:1.5px solid var(--slate-200);border-radius:var(--radius-sm);outline:none;color:var(--slate-700);transition:border-color .2s;width:200px}
.tree-search:focus{border-color:var(--brand)}
#treeSvg{display:block;width:auto;max-width:none;overflow:visible}
.tree-node-label{font-family:'Poppins',sans-serif;font-size:11px;fill:var(--slate-700);cursor:pointer}
.tree-node-label:hover{fill:var(--brand)}

/* TABLE VIEW */
#tableView{display:none;background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-lg);overflow:hidden}
.table-header{padding:14px 18px;border-bottom:1px solid var(--slate-100);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.table-search{font-family:'Poppins',sans-serif;font-size:.78rem;padding:7px 12px;border:1.5px solid var(--slate-200);border-radius:var(--radius-sm);outline:none;color:var(--slate-700);transition:border-color .2s;width:220px}
.table-search:focus{border-color:var(--brand)}
.link-table{width:100%;border-collapse:collapse}
.link-table th{padding:11px 16px;font-family:'Space Grotesk',sans-serif;font-size:.72rem;font-weight:700;color:var(--slate-500);text-align:left;border-bottom:1.5px solid var(--slate-200);background:var(--slate-50);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;user-select:none;white-space:nowrap}
.link-table th:hover{color:var(--brand)}
.link-table th .sort-icon{margin-left:4px;opacity:.4}
.link-table th.sorted .sort-icon{opacity:1;color:var(--brand)}
.link-table td{padding:11px 16px;font-size:.82rem;color:var(--slate-700);border-bottom:1px solid var(--slate-100);vertical-align:middle}
.link-table tr:last-child td{border-bottom:none}
.link-table tr:hover td{background:var(--slate-50)}
.url-cell{font-family:'Poppins',sans-serif;font-size:.78rem;color:var(--brand);word-break:break-all;max-width:300px}
.url-cell a{color:inherit;text-decoration:none}
.url-cell a:hover{text-decoration:underline}
.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:22px;padding:0 8px;border-radius:100px;font-family:'Space Grotesk',sans-serif;font-size:.72rem;font-weight:700}
.badge-high{background:var(--green-bg);color:var(--green);border:1px solid var(--green-light)}
.badge-mid{background:var(--brand-50);color:var(--brand);border:1px solid var(--brand-100)}
.badge-low{background:var(--slate-100);color:var(--slate-500);border:1px solid var(--slate-200)}
.badge-zero{background:var(--red-bg);color:var(--red);border:1px solid var(--red-light)}
.depth-pill{display:inline-flex;align-items:center;padding:2px 8px;border-radius:100px;font-size:.68rem;font-weight:600;background:var(--slate-100);color:var(--slate-500)}
.link-bar-wrap{display:flex;align-items:center;gap:8px}
.link-bar{height:6px;border-radius:3px;background:var(--brand);min-width:2px;transition:width .3s}
.page-type-badge{font-size:.68rem;font-weight:600;padding:2px 8px;border-radius:100px}
.type-home{background:#ede9fe;color:#5b21b6}
.type-blog{background:#fef3c7;color:#92400e}
.type-page{background:var(--brand-50);color:var(--brand)}
.type-other{background:var(--slate-100);color:var(--slate-500)}

/* ORPHAN & ISSUES */
.issues-section{margin-top:24px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.issue-card{background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-lg);padding:20px}
.issue-card-title{font-family:'Space Grotesk',sans-serif;font-size:.88rem;font-weight:700;margin-bottom:4px;display:flex;align-items:center;gap:7px}
.issue-card-title svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.issue-card-sub{font-size:.75rem;color:var(--slate-500);margin-bottom:14px}
.issue-list{display:flex;flex-direction:column;gap:6px;max-height:180px;overflow-y:auto}
.issue-item{font-size:.75rem;padding:7px 10px;border-radius:var(--radius-sm);word-break:break-all;line-height:1.4}
.issue-item.orphan{background:var(--red-bg);color:#9f1239;border:1px solid var(--red-light)}
.issue-item.hub{background:var(--green-bg);color:#14532d;border:1px solid var(--green-light)}
.issue-item.deep{background:var(--yellow-bg);color:#713f12;border:1px solid var(--yellow-light)}
.issue-empty{font-size:.78rem;color:var(--slate-400);text-align:center;padding:16px}

/* EMPTY STATE */
.empty-state{text-align:center;padding:80px 24px;color:var(--slate-400)}
.empty-state svg{width:56px;height:56px;stroke:var(--slate-300);fill:none;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;margin:0 auto 16px;display:block}
.empty-state h3{font-size:1rem;font-weight:700;color:var(--slate-600);margin-bottom:6px}
.empty-state p{font-size:.82rem;line-height:1.6;max-width:340px;margin:0 auto}

/* ERROR TOAST */
.error-banner{background:var(--red-bg);border:1.5px solid var(--red-light);border-radius:var(--radius-md);padding:12px 16px;margin-top:12px;font-size:.8rem;color:#9f1239;display:none;align-items:center;gap:8px}
.error-banner svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0}

/* FAQ */
.faq-section{max-width:860px;margin:0 auto;padding:0 2rem 64px}
.faq-title{font-size:1.25rem;font-weight:700;color:var(--slate-900);margin-bottom:20px;letter-spacing:-.02em}
.faq-item{background:var(--white);border:1.5px solid var(--slate-200);border-radius:var(--radius-md);margin-bottom:10px;overflow:hidden}
.faq-q{padding:16px 20px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.875rem;font-weight:600;color:var(--slate-800);transition:background .2s;user-select:none}
.faq-q:hover{background:var(--slate-50)}
.faq-q svg{width:16px;height:16px;stroke:var(--slate-400);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s;flex-shrink:0}
.faq-q.open svg{transform:rotate(180deg)}
.faq-a{padding:0 20px;font-size:.84rem;color:var(--slate-600);line-height:1.7;max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s}
.faq-a.open{max-height:200px;padding:4px 20px 16px}

/* FOOTER */
footer{background:var(--slate-900);border-top:1px solid rgba(255,255,255,.06);padding:40px 2.5rem}
.footer-inner{max-width:1240px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px}
.footer-logo-text{font-family:'Space Grotesk',sans-serif;font-size:1rem;font-weight:700;color:rgba(255,255,255,.85);letter-spacing:-.02em}
.footer-links{display:flex;gap:1.75rem;list-style:none;flex-wrap:wrap}
.footer-links a{font-size:.84rem;color:rgba(255,255,255,.42);text-decoration:none;transition:color .2s}
.footer-links a:hover{color:rgba(255,255,255,.8)}
.footer-bottom{max-width:1240px;margin:24px auto 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.06);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.footer-copy,.footer-tagline{font-size:.78rem;color:rgba(255,255,255,.28)}

@media(max-width:900px){.stats-bar{grid-template-columns:1fr 1fr}.issues-section{grid-template-columns:1fr}}
@media(max-width:640px){nav{padding:0 1.25rem}.nav-links{display:none}.crawl-row{flex-direction:column}.crawl-btn{width:100%;justify-content:center}.main-wrap{padding:32px 1.25rem 48px}.stats-bar{grid-template-columns:1fr 1fr}.faq-section{padding:0 1.25rem 48px}footer{padding:36px 1.25rem}}
/* TREE DRAG / PAN */
.tree-pan-wrap{
  position:relative;
  overflow:auto;
  max-height:78vh;
  min-height:420px;
  padding:20px;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  touch-action:pan-x pan-y;
  overscroll-behavior:contain;
  scrollbar-gutter:stable both-edges;
}
.tree-pan-wrap.is-dragging{cursor:grabbing}
.tree-pan-wrap.is-dragging *{cursor:grabbing!important}
.tree-pan-wrap #treeSvg{
  display:block;
  width:auto;
  max-width:none;
  overflow:visible;
}
.tree-pan-hint{
  position:sticky;
  left:12px;
  top:10px;
  z-index:5;
  width:max-content;
  margin-bottom:-34px;
  padding:7px 10px;
  border:1px solid var(--slate-200);
  border-radius:9px;
  background:rgba(255,255,255,.94);
  box-shadow:0 4px 14px rgba(15,23,42,.08);
  color:var(--slate-500);
  font-size:.7rem;
  font-weight:600;
  pointer-events:none;
  backdrop-filter:blur(6px);
  transition:opacity .2s ease;
}
.tree-pan-wrap.has-panned .tree-pan-hint{opacity:0}
@media(max-width:700px){
  .tree-pan-wrap{max-height:68vh;min-height:360px;padding:14px}
  .tree-pan-hint{display:none}
}