@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#10241d; --ink-2:#213c31; --cream:#f2efe7; --paper:#fbfaf6; --line:#d8d8ce; --muted:#727970; --acid:#d8ff63; --orange:#f28d61; --white:#fff; --shadow:0 18px 50px rgba(16,36,29,.09); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--cream); }
body { margin:0; min-width:320px; color:var(--ink); background:var(--paper); font-family:'Manrope',system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
.grain { position:fixed; inset:0; pointer-events:none; z-index:20; opacity:.05; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.3'/%3E%3C/svg%3E"); }
.topbar { height:80px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(20px,5vw,72px); border-bottom:1px solid var(--line); background:rgba(251,250,246,.93); position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); }
.brand { display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); }
.brand-mark { display:grid; place-items:center; width:35px; height:35px; color:var(--acid); background:var(--ink); font:500 13px 'DM Mono',monospace; letter-spacing:-1px; transform:rotate(-7deg); box-shadow:4px 4px 0 var(--orange); }
.brand-copy { display:flex; flex-direction:column; line-height:1.05; letter-spacing:-.04em; }.brand-copy strong { font-size:16px; }.brand-copy small { font-size:11px; color:var(--muted); letter-spacing:.03em; margin-top:3px; }
.topbar-actions { display:flex; gap:8px; }.icon-button { border:1px solid var(--line); background:transparent; color:var(--ink); border-radius:999px; min-height:38px; padding:0 13px; display:flex; align-items:center; gap:7px; font-size:12px; font-weight:700; }.icon-button:hover { background:var(--ink); color:var(--acid); border-color:var(--ink); }.icon { font:16px 'DM Mono',monospace; }.desktop-only { font-size:11px; }
.app-shell { max-width:1160px; margin:0 auto; padding:0 24px 60px; }.hero { min-height:280px; padding:56px 0 47px; display:flex; justify-content:space-between; align-items:flex-end; border-bottom:1px solid var(--line); position:relative; }.hero:after { content:''; position:absolute; width:150px; height:150px; border:1px solid var(--line); border-radius:50%; right:12%; top:42px; opacity:.55; }.hero-copy { position:relative; z-index:1; }.eyebrow { margin:0 0 13px; font:500 10px 'DM Mono',monospace; letter-spacing:.13em; color:var(--muted); }.live-dot { display:inline-block; width:6px; height:6px; background:var(--orange); border-radius:50%; margin-right:7px; box-shadow:0 0 0 4px rgba(242,141,97,.18); }.hero h1 { margin:0; font-size:clamp(42px,7vw,78px); line-height:.97; letter-spacing:-.075em; font-weight:800; }.hero h1 em { color:var(--orange); font-style:normal; }.hero-text { max-width:420px; margin:22px 0 0; font-size:14px; line-height:1.7; color:var(--muted); }.hero-stamp { position:relative; z-index:1; align-self:flex-start; margin-top:10px; display:flex; flex-direction:column; gap:3px; font:500 10px 'DM Mono',monospace; letter-spacing:.1em; color:var(--ink); }.hero-stamp span:first-child { color:var(--orange); font-size:28px; letter-spacing:-.1em; }
.tabbar { display:flex; border-bottom:1px solid var(--ink); gap:0; }.tab { border:0; background:transparent; color:var(--muted); padding:20px 25px 17px 0; margin-right:27px; font-size:12px; font-weight:800; display:flex; gap:9px; align-items:center; position:relative; }.tab span { font:400 10px 'DM Mono',monospace; color:var(--orange); }.tab b { display:grid; place-items:center; min-width:18px; height:18px; padding:0 5px; background:var(--acid); border-radius:20px; font-size:10px; color:var(--ink); }.tab.active { color:var(--ink); }.tab.active:after { content:''; position:absolute; bottom:-1px; left:0; right:0; height:3px; background:var(--ink); }
.view { display:none; padding-top:45px; animation:rise .35s ease both; }.view.active { display:block; } @keyframes rise { from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:translateY(0)} }
.section-heading { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:29px; }.section-heading h2 { margin:0; font-size:clamp(28px,4vw,43px); letter-spacing:-.07em; line-height:1; }.section-heading .eyebrow { margin-bottom:10px; }.section-index { font:500 12px 'DM Mono',monospace; color:var(--orange); padding-top:3px; }
.target-form { max-width:760px; background:#e9eadf; padding:27px clamp(20px,4vw,42px) 33px; position:relative; }.target-form:before { content:'01'; position:absolute; right:23px; top:25px; color:rgba(16,36,29,.25); font:500 11px 'DM Mono',monospace; }.form-row { position:relative; }.field-label { display:block; font:500 10px 'DM Mono',monospace; letter-spacing:.13em; color:var(--muted); margin-bottom:9px; }.select-wrap { border-bottom:1px solid var(--ink); max-width:300px; }.select-wrap:after { content:'↓'; position:absolute; top:22px; right:0; font:13px 'DM Mono',monospace; pointer-events:none; }.select-wrap select, .target-row input { appearance:none; border:0; background:transparent; width:100%; outline:none; color:var(--ink); }.select-wrap select { padding:0 0 10px; font-weight:700; }.target-row { margin-top:29px; }.target-row input { border-bottom:2px solid var(--ink); padding:7px 32px 13px 0; font-size:clamp(22px,4vw,34px); letter-spacing:-.06em; font-weight:700; }.target-row input::placeholder { color:#a0a59d; }.clear-input { position:absolute; right:0; bottom:16px; border:0; background:var(--ink); color:var(--acid); border-radius:50%; width:21px; height:21px; line-height:18px; font-size:18px; padding:0; }.form-foot { margin-top:24px; display:flex; align-items:center; justify-content:space-between; gap:20px; }.privacy-note { margin:0; color:var(--muted); font-size:11px; line-height:1.4; }.lock { font-family:'DM Mono',monospace; color:var(--orange); margin-right:5px; }.primary-button { border:0; background:var(--ink); color:var(--acid); min-height:46px; padding:0 16px 0 19px; display:inline-flex; align-items:center; justify-content:space-between; gap:22px; font-size:12px; font-weight:800; white-space:nowrap; }.primary-button:hover { background:var(--orange); color:var(--ink); }.primary-button .arrow { font:18px 'DM Mono',monospace; }.primary-button.compact { min-height:39px; padding:0 13px; font-size:11px; }.results-head { display:flex; align-items:flex-end; justify-content:space-between; margin:50px 0 17px; }.results-head h3 { margin:0; font-size:21px; letter-spacing:-.05em; }.results-head .eyebrow { margin-bottom:7px; }.text-button { border:0; background:transparent; padding:0; color:var(--orange); font:700 11px 'DM Mono',monospace; }.text-button:hover { color:var(--ink); }.source-list { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }.source-card { min-height:110px; display:flex; justify-content:space-between; align-items:flex-start; padding:18px 18px 17px; border:1px solid var(--line); background:var(--white); text-decoration:none; color:var(--ink); transition:transform .2s, border-color .2s, box-shadow .2s; }.source-card:hover { transform:translateY(-3px); border-color:var(--ink); box-shadow:7px 7px 0 var(--acid); }.source-card .source-number { color:var(--orange); font:500 10px 'DM Mono',monospace; }.source-card h4 { margin:12px 0 4px; font-size:15px; letter-spacing:-.04em; }.source-card p { margin:0; color:var(--muted); font-size:11px; }.source-card .external { font:18px 'DM Mono',monospace; color:var(--ink); }.responsibility-note { margin-top:38px; border-top:1px solid var(--line); padding:20px 0; display:flex; gap:15px; max-width:760px; }.note-symbol { font-size:20px; color:var(--orange); }.responsibility-note strong { display:block; font-size:12px; }.responsibility-note p { color:var(--muted); margin:5px 0 0; font-size:11px; line-height:1.6; }
.dork-intro { max-width:640px; display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:-10px 0 27px; }.dork-intro p { width:100%; margin:0 0 8px; color:var(--muted); line-height:1.65; font-size:13px; }.operator-chip { background:var(--acid); padding:6px 8px; color:var(--ink); font:500 10px 'DM Mono',monospace; }.dork-target-card { max-width:760px; padding:22px 25px; background:var(--ink); }.dork-target-card .field-label { color:#a6b2aa; }.inline-input { display:flex; gap:10px; }.inline-input input { flex:1; min-width:0; border:0; border-bottom:1px solid #708477; outline:0; padding:7px 0 11px; background:transparent; color:var(--acid); font-size:20px; letter-spacing:-.05em; }.inline-input input::placeholder { color:#85958b; }.square-button { flex:none; width:42px; height:42px; border:0; background:var(--acid); color:var(--ink); font:19px 'DM Mono',monospace; }.dork-list { max-width:760px; padding-top:18px; }.dork-card { background:var(--white); border:1px solid var(--line); margin-bottom:9px; padding:15px 16px; display:flex; align-items:center; gap:15px; }.dork-card .dork-index { font:500 10px 'DM Mono',monospace; color:var(--orange); }.dork-card code { flex:1; overflow-wrap:anywhere; color:var(--ink); font:12px/1.55 'DM Mono',monospace; }.dork-actions { display:flex; gap:5px; }.mini-button { border:1px solid var(--line); background:transparent; color:var(--muted); padding:7px 8px; font:500 10px 'DM Mono',monospace; }.mini-button:hover { color:var(--ink); border-color:var(--ink); }.empty-state { border:1px dashed var(--line); padding:42px 20px; text-align:center; color:var(--muted); }.empty-state.small { max-width:760px; }.empty-icon { color:var(--orange); display:block; font-size:28px; margin-bottom:10px; }.empty-state p { margin:0; font-size:12px; }
.notebook-toolbar { display:flex; align-items:center; justify-content:space-between; max-width:760px; margin:-5px 0 18px; }.notebook-toolbar p { margin:0; color:var(--muted); font-size:12px; }.case-list { max-width:760px; }.case-card { position:relative; background:var(--white); border:1px solid var(--line); padding:20px; margin-bottom:10px; }.case-card-head { display:flex; justify-content:space-between; gap:15px; }.case-card h3 { margin:0 0 7px; font-size:16px; letter-spacing:-.04em; }.case-meta { color:var(--orange); font:500 10px 'DM Mono',monospace; }.case-date { color:var(--muted); font:10px 'DM Mono',monospace; }.case-notes { margin:15px 0 0; padding-top:13px; border-top:1px solid #ecece5; color:var(--muted); font-size:12px; line-height:1.6; white-space:pre-wrap; }.case-actions { display:flex; gap:5px; margin-top:15px; }.delete-button:hover { border-color:#c75a45; color:#c75a45; }
.footer { max-width:1160px; margin:0 auto; padding:20px 24px 45px; border-top:1px solid var(--line); color:var(--muted); font:10px 'DM Mono',monospace; display:flex; justify-content:space-between; gap:20px; }.footer b { color:var(--orange); }.footer button { padding:0; background:none; border:0; color:var(--ink); font:10px 'DM Mono',monospace; text-decoration:underline; text-underline-offset:3px; }
.modal-backdrop { position:fixed; inset:0; z-index:30; background:rgba(16,36,29,.62); display:grid; place-items:center; padding:20px; backdrop-filter:blur(5px); }.modal-backdrop[hidden] { display:none; }.modal { width:min(100%,560px); max-height:calc(100vh - 40px); overflow:auto; background:var(--paper); padding:27px clamp(22px,5vw,40px) 32px; box-shadow:var(--shadow); }.modal-head { display:flex; justify-content:space-between; gap:20px; margin-bottom:27px; }.modal h2 { margin:0; font-size:29px; letter-spacing:-.07em; }.close-button { border:0; background:transparent; color:var(--ink); font-size:28px; line-height:1; padding:0 0 5px; }.modal form > input, .modal form > textarea, .modal-grid input, .modal-grid select { width:100%; border:0; border-bottom:1px solid var(--ink); background:transparent; outline:none; padding:9px 0 12px; color:var(--ink); margin-bottom:23px; }.modal form > input { font-size:20px; font-weight:700; letter-spacing:-.05em; }.modal-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:18px; }.modal-grid select { appearance:none; }.modal form > textarea { resize:vertical; line-height:1.6; font-size:13px; }.modal-foot { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:4px; }.modal-foot p,.install-footnote { color:var(--muted); font-size:10px; line-height:1.5; margin:0; }.install-steps { border-top:1px solid var(--line); }.install-step { display:flex; gap:17px; padding:20px 0; border-bottom:1px solid var(--line); }.install-step > span { color:var(--orange); font:500 11px 'DM Mono',monospace; }.install-step strong { font-size:13px; }.install-step p { color:var(--muted); font-size:12px; line-height:1.6; margin:6px 0 0; }.install-step b { color:var(--ink); }.install-footnote { margin-top:20px; }
.toast { position:fixed; left:50%; bottom:24px; z-index:50; transform:translate(-50%,20px); opacity:0; pointer-events:none; background:var(--ink); color:var(--acid); padding:12px 17px; font:11px 'DM Mono',monospace; transition:.25s ease; box-shadow:5px 5px 0 var(--orange); }.toast.show { opacity:1; transform:translate(-50%,0); }
.topbar { height:68px; padding:0 18px; }
.app-shell { padding:0 18px 45px; }
.hero { min-height:290px; padding:45px 0 38px; align-items:flex-start; }
.hero-stamp { margin-top:4px; }
.hero:after { right:-24px; top:62px; width:125px; height:125px; }
.hero-text { font-size:13px; max-width:330px; }
.tab { padding-top:16px; padding-bottom:14px; margin-right:18px; padding-right:0; font-size:11px; }
.tab span { display:none; }
.view { padding-top:36px; }
.section-heading { margin-bottom:24px; }
.target-form { padding:23px 19px 25px; }
.target-form:before { right:18px; top:21px; }
.form-foot { align-items:flex-start; flex-direction:column; gap:16px; }
.primary-button { width:100%; }
.source-list { grid-template-columns:1fr; }
.results-head { align-items:flex-start; gap:15px; flex-direction:column; margin-top:38px; }
.results-head .text-button { align-self:flex-end; margin-top:-5px; }
.footer { padding-left:18px; padding-right:18px; flex-direction:column; gap:9px; }
.footer button { align-self:flex-start; }
.dork-card { align-items:flex-start; flex-wrap:wrap; }
.dork-card code { order:2; width:100%; flex-basis:calc(100% - 30px); }
.dork-actions { margin-left:25px; }
.modal-grid { grid-template-columns:1fr; gap:0; }
.modal-foot { align-items:stretch; flex-direction:column; }
.modal-foot .primary-button { width:100%; }
.desktop-only { display:none; }
@media (min-width:701px) {
  .topbar { height:80px; padding:0 clamp(20px,5vw,72px); }
  .app-shell { max-width:1160px; padding:0 24px 60px; }
  .hero { min-height:280px; padding:56px 0 47px; align-items:flex-end; }
  .hero-stamp { margin-top:10px; }
  .hero:after { right:12%; top:42px; width:150px; height:150px; }
  .hero-text { font-size:14px; max-width:420px; }
  .tab { padding:20px 25px 17px 0; margin-right:27px; font-size:12px; }
  .tab span { display:inline; }
  .view { padding-top:45px; min-height:510px; }
  .section-heading { margin-bottom:29px; }
  .target-form { padding:27px clamp(20px,4vw,42px) 33px; }
  .target-form:before { right:23px; top:25px; }
  .form-foot { align-items:center; flex-direction:row; gap:20px; }
  .primary-button { width:auto; }
  .source-list { grid-template-columns:repeat(2,1fr); }
  .results-head { align-items:flex-end; flex-direction:row; gap:0; margin-top:50px; }
  .results-head .text-button { align-self:auto; margin-top:0; }
  .footer { padding:20px 24px 45px; flex-direction:row; gap:20px; }
  .footer button { align-self:auto; }
  .dork-card { align-items:center; flex-wrap:nowrap; }
  .dork-card code { order:initial; width:auto; flex-basis:auto; }
  .dork-actions { margin-left:0; }
  .modal-grid { grid-template-columns:.75fr 1.25fr; gap:18px; }
  .modal-foot { align-items:center; flex-direction:row; }
  .modal-foot .primary-button { width:auto; }
  .desktop-only { display:inline; }
}
