@import url("https://fonts.googleapis.com/css2?family=DM+Mono&family=Noto+Sans+Thai:wght@400;500;600;700&display=swap");:root{--ink:#10212d;--muted:#61727c;--line:#d8e0e2;--paper:#f6f8f4;--lime:#c8f45a;--orange:#ff693d;--blue:#155f76}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Noto Sans Thai,sans-serif}a{color:inherit}.content,.filters,.hero,.topbar,footer{max-width:1200px;margin:auto}.topbar{padding:22px 28px;display:flex;justify-content:space-between;align-items:center}.brand{font-size:20px;font-weight:700;text-decoration:none}.brand span{color:var(--blue)}nav{display:flex;gap:22px;font-size:14px}footer a,nav a{text-decoration:none;border-bottom:1px solid var(--ink)}.hero{padding:70px 28px 56px;background:radial-gradient(circle at 82% 30%,#d9f8a0 0,transparent 26%)}.eyebrow{color:var(--blue);font:12px DM Mono,monospace;letter-spacing:.1em;margin:0 0 14px}h1{font-size:clamp(42px,7vw,80px);letter-spacing:-.06em;line-height:1.02;max-width:800px;margin:0}h1 em{color:var(--orange);font-style:normal}.intro{font-size:18px;max-width:600px;color:var(--muted);margin:25px 0}.search{display:flex;max-width:760px;background:white;border:1px solid var(--ink);padding:6px;box-shadow:6px 6px 0 var(--ink)}button,input,select{font:inherit}.search input{flex:1 1;min-width:0;border:0;padding:13px;outline:0}.search button{border:0;background:var(--ink);color:white;font-weight:700;padding:10px 22px;cursor:pointer}.examples{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px;font-size:13px}.examples span{color:var(--muted)}.examples button{border:1px solid var(--ink);background:white;padding:6px 12px;cursor:pointer;font-size:13px}.examples button:hover{background:var(--lime)}.status{font-size:13px;margin-top:23px;color:var(--muted)}.status.demo{color:#7b5611}.status.api{color:#1e7152}.filters{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 28px;display:flex;gap:14px;align-items:end;flex-wrap:wrap}label{display:grid;grid-gap:5px;gap:5px;color:var(--muted);font-size:12px}label input,select{border:1px solid var(--line);background:white;padding:8px;color:var(--ink);min-height:38px}.clear{background:transparent;border:0;padding:9px 0;text-decoration:underline;cursor:pointer}.content{padding:34px 28px 56px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);grid-gap:30px;gap:30px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.section-title p{margin:0;font-size:14px;color:var(--muted)}.dataset{width:100%;display:grid;grid-template-columns:62px 1fr;grid-gap:14px;gap:14px;text-align:left;background:transparent;border:0;border-top:1px solid var(--line);padding:22px 3px;cursor:pointer;color:inherit}.dataset:last-child{border-bottom:1px solid var(--line)}.dataset.active{background:#eaf2e8;padding-left:10px;padding-right:10px}.score{font:15px DM Mono,monospace;color:var(--blue);padding-top:4px}h2{font-size:22px;line-height:1.3;margin:0 0 6px}.dataset p{margin:2px 0;color:var(--muted);font-size:13px}.dataset .evidence{color:#325363;margin:9px 0}small{color:var(--muted)}.detail{background:white;border:1px solid var(--ink);padding:26px;align-self:start;position:-webkit-sticky;position:sticky;top:20px;box-shadow:7px 7px 0 var(--lime)}.detail>p{color:var(--muted)}h3{font-size:14px;margin:25px 0 8px}dl{border-top:1px solid var(--line);margin:20px 0;padding-top:12px;display:grid;grid-template-columns:110px 1fr;grid-gap:7px;gap:7px;font-size:13px}dt{color:var(--muted)}dd,ul{margin:0}ul{padding-left:18px;font-size:13px}pre{white-space:pre-wrap;overflow:auto;background:#10212d;color:#e4f2e8;font:12px DM Mono,monospace;padding:14px}.feedback{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:20px;font-size:13px}.feedback button{border:1px solid var(--ink);background:white;padding:6px 9px;cursor:pointer}.feedback-note{color:var(--blue)!important;font-size:13px}.empty{padding:30px 0}.empty,footer{color:var(--muted)}footer{border-top:1px solid var(--line);padding:22px 28px 40px;display:flex;justify-content:space-between;font-size:13px}@media (max-width:800px){.hero{padding-top:40px}.content{grid-template-columns:1fr}.detail{position:static}}@media (max-width:480px){.topbar{padding-inline:18px}nav{gap:12px}.content,.filters,.hero,footer{padding-left:18px;padding-right:18px}.search button{padding-inline:13px}footer{gap:12px;flex-direction:column}}