:root { --ink:#17221d; --muted:#627169; --line:#dbe4de; --accent:#0b7555; --soft:#f0f7f3; --paper:#fff; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:#fbfcfb; font:16px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.site-header, main, .site-footer { max-width:1180px; margin:auto; padding-left:24px; padding-right:24px; }.site-header { display:flex; align-items:start; justify-content:space-between; gap:24px; padding-top:48px; padding-bottom:34px; }.compact-header { padding-bottom:24px; }.eyebrow { margin:0; color:var(--accent); font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; } h1 { margin:3px 0 6px; font-size:clamp(2rem,5vw,3rem); line-height:1.1; letter-spacing:-.05em; }.subhead { max-width:660px; margin:0; color:var(--muted); }.download { flex:none; border:1px solid var(--accent); border-radius:8px; color:var(--accent); padding:9px 12px; text-decoration:none; font-weight:600; }.download:hover { background:var(--soft); }.notice { padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--paper); }.summary { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }.stat { padding:6px 10px; background:var(--paper); border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:.86rem; }.stat strong { color:var(--accent); }.tabs { display:flex; border-bottom:1px solid var(--line); margin-bottom:22px; }.tab { border:0; border-bottom:3px solid transparent; padding:10px 14px; background:transparent; color:var(--muted); font:inherit; cursor:pointer; }.tab.active { border-color:var(--accent); color:var(--ink); font-weight:700; }.panel { display:none; }.panel.active { display:block; } .search-label { display:block; margin-bottom:7px; font-weight:600; } input, select { border:1px solid #adbbb3; border-radius:8px; background:white; color:var(--ink); padding:12px; font:inherit; } input { width:100%; } input:focus, select:focus { outline:3px solid #c9e7d9; border-color:var(--accent); }.hint { color:var(--muted); font-size:.9rem; }.exercise-layout { display:grid; grid-template-columns:minmax(250px,.8fr) minmax(0,1.7fr); gap:20px; align-items:start; }.result-list, .detail, .table-view { border:1px solid var(--line); border-radius:10px; background:var(--paper); overflow:hidden; }.result { display:block; width:100%; padding:11px 14px; border:0; border-bottom:1px solid var(--line); background:var(--paper); font:inherit; text-align:left; cursor:pointer; }.result:hover,.result.selected { background:var(--soft); }.result small { display:block; color:var(--muted); margin-top:2px; }.detail { padding:22px; min-height:360px; }.detail.empty { color:var(--muted); }.detail h2 { margin:0; line-height:1.15; }.detail h3 { margin:26px 0 8px; font-size:1rem; }.meta { margin:5px 0 18px; color:var(--muted); font-size:.9rem; }.data-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:8px; }.field { padding:9px 11px; background:var(--soft); border-radius:7px; overflow-wrap:anywhere; }.field small { display:block; color:var(--muted); }.translation { border-top:1px solid var(--line); padding:13px 0; }.translation:first-of-type { border-top:0; }.translation p { white-space:pre-wrap; }.relation-list { display:flex; flex-wrap:wrap; gap:6px; }.tag { background:var(--soft); border-radius:999px; padding:4px 8px; font-size:.86rem; }.table-controls { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }.table-wrap { overflow:auto; }.data-table { width:100%; border-collapse:collapse; font-size:.86rem; }.data-table th { text-align:left; background:var(--soft); }.data-table th,.data-table td { border-bottom:1px solid var(--line); padding:9px 11px; vertical-align:top; white-space:pre-wrap; overflow-wrap:anywhere; }.data-table td { max-width:330px; }.error { border-color:#c66; color:#8b2020; background:#fff5f5; } code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }.legal-page { max-width:760px; }.legal-page section { border-top:1px solid var(--line); padding:24px 0 6px; }.legal-page h2 { margin:0 0 14px; }.legal-page h3 { margin:22px 0 5px; font-size:1rem; }.legal-page address { font-style:normal; }.legal-page a, .site-footer a { color:var(--accent); }.site-footer { display:flex; gap:18px; padding-top:42px; padding-bottom:32px; font-size:.9rem; } @media (max-width:720px) { .site-header { display:block; padding-top:30px; }.download { display:inline-block; margin-top:16px; }.exercise-layout { grid-template-columns:1fr; }.result-list { max-height:360px; overflow:auto; } }
