:root{color:#172033;background:#eef5f8;font-family:Inter,Hiragino Sans,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;font-synthesis:none;line-height:1.5;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}.app-shell{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;min-height:100vh;padding:24px;background:radial-gradient(circle at 10% 10%,rgba(72,187,167,.22),transparent 32%),radial-gradient(circle at 82% 16%,rgba(70,130,210,.18),transparent 30%),linear-gradient(135deg,#f8fbfc,#dcecf0 58%,#f4f7f3)}.search-workspace,.detail-panel{border:1px solid rgba(255,255,255,.72);border-radius:8px;background:#ffffff9e;box-shadow:0 20px 60px #213b5324;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.search-workspace{display:flex;flex-direction:column;gap:18px;min-width:0;padding:24px}.page-header{display:grid;gap:8px;max-width:820px}.eyebrow{margin:0;color:#256d7b;font-size:.82rem;font-weight:700;letter-spacing:0}h1,h2,h3,p{margin:0}h1{color:#111827;font-size:clamp(2rem,4vw,3.7rem);line-height:1.08}h2{color:#172033;font-size:1.25rem}h3{color:#21344d;font-size:1rem}.page-header p:not(.eyebrow){color:#4b5b70}.search-box{display:grid;gap:8px}.search-box label{color:#21344d;font-weight:700}.search-box input{width:100%;border:1px solid rgba(80,120,145,.32);border-radius:8px;padding:14px 16px;color:#142033;background:#ffffffd6;outline:none}.search-box input:focus{border-color:#267b8a;box-shadow:0 0 0 4px #267b8a24}.filter-row{display:flex;flex-wrap:wrap;gap:8px}.filter-button{border:1px solid rgba(80,120,145,.28);border-radius:999px;padding:8px 12px;color:#294155;background:#ffffffad}.filter-button.is-active{border-color:#267b8a;color:#fff;background:#267b8a}.result-section{display:grid;gap:12px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.section-heading span{color:#597084;font-size:.92rem}.result-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}.result-item{display:contents}.compound-card{display:grid;gap:8px;min-height:164px;border:1px solid rgba(80,120,145,.22);border-radius:8px;padding:14px;text-align:left;color:#1d2d42;background:#ffffffb3;transition:transform .16s ease,border-color .16s ease,background .16s ease}.compound-card:hover,.compound-card:focus-visible{border-color:#267b8a;background:#ffffffeb;transform:translateY(-2px)}.compound-card__topline{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#587184;font-size:.82rem}.compound-card__formula{color:#111827;font-size:1.65rem;line-height:1.1}.compound-card__name{color:#1e3a52;font-weight:700}.compound-card__sub{color:#5d6f80;font-size:.9rem;overflow-wrap:anywhere}.compound-card--external{background:#f5f9ffb8}.badge{display:inline-flex;align-items:center;width:fit-content;border-radius:999px;padding:4px 8px;font-size:.76rem;font-weight:700;line-height:1}.badge--local{color:#155b4f;background:#38b28f2e}.badge--external{color:#315d94;background:#508bd22e}.badge--neutral{color:#43566a;background:#43566a1f}.detail-panel{display:flex;flex-direction:column;gap:18px;align-self:start;padding:22px;overflow:auto}.inline-detail{grid-column:1 / -1}.inline-detail .detail-panel{overflow:visible}.detail-panel--empty{color:#53697f}.detail-panel__formula{color:#111827;font-size:2.2rem;font-weight:800;line-height:1}.detail-panel__sub{color:#5d6f80}.definition-list{display:grid;gap:8px;margin:0}.definition-list div{display:grid;grid-template-columns:minmax(86px,.5fr) minmax(0,1fr);gap:12px;border-bottom:1px solid rgba(80,120,145,.16);padding:8px 0}.definition-list dt{color:#53697f;font-weight:700}.definition-list dd{min-width:0;margin:0;color:#18263a;overflow-wrap:anywhere}.structure-viewer{width:100%;max-width:340px}.structure-viewer__canvas{width:100%;aspect-ratio:1;overflow:hidden;border:1px solid rgba(80,120,145,.18);border-radius:8px;background:#fffdf8}.structure-viewer__canvas line{stroke:#111827;stroke-width:1.8;stroke-linecap:round}.structure-viewer__canvas text{fill:#111827;stroke:#fffdf8;stroke-width:3.5;paint-order:stroke fill;font-size:10px;font-weight:800;letter-spacing:0}.pubchem-structure{display:grid;place-items:center;width:100%;max-width:340px;aspect-ratio:1;overflow:hidden;border:1px solid rgba(80,120,145,.18);border-radius:8px;background:#fffdf8}.pubchem-structure img{display:block;width:80%;height:80%;object-fit:contain}.uses-list{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}.uses-list li{border-radius:999px;padding:6px 10px;color:#294155;background:#267b8a1a}.note{color:#5a6f83;font-size:.94rem}@media(max-width:960px){.app-shell{grid-template-columns:1fr;padding:14px}.search-workspace,.detail-panel{padding:16px}}@media(max-width:560px){.result-grid{grid-template-columns:1fr}.definition-list div{grid-template-columns:1fr;gap:4px}}
