:root{--bg:#f4f7f6;--surface:#fff;--ink:#17282b;--muted:#536a6d;--line:#d5e0df;--accent:#3a4fd6;--accent-ink:#fff;--accent-soft:#e8ebfb;--shadow:0 1px 2px #17282b0f, 0 8px 24px #17282b0f;--radius:18px;--font:"Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", Meiryo, system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#0f1617;--surface:#182224;--ink:#e6efee;--muted:#9db3b3;--line:#2b3b3e;--accent:#94a3ff;--accent-ink:#10153a;--accent-soft:#232b52;--shadow:0 1px 2px #0000004d, 0 8px 24px #00000040}}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.7}h1,h2,h3,p,ul{margin:0}ul{padding:0;list-style:none}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.container{width:100%;max-width:1040px;padding-inline:max(20px, env(safe-area-inset-left), env(safe-area-inset-right));margin-inline:auto}.brand{letter-spacing:.02em;align-items:center;gap:10px;font-size:18px;font-weight:700;display:inline-flex}.button{background:var(--accent);min-height:44px;color:var(--accent-ink);border-radius:999px;align-items:center;padding:0 22px;font-weight:700;display:inline-flex}.site-header{border-bottom:1px solid var(--line)}.site-header__inner{align-items:center;min-height:64px;display:flex}.site-footer{padding-block:28px calc(28px + env(safe-area-inset-bottom));border-top:1px solid var(--line);color:var(--muted);margin-top:72px}.hero{padding-block:clamp(48px,9vw,96px) clamp(32px,6vw,56px)}.hero__eyebrow{color:var(--accent);letter-spacing:.12em;font-size:14px;font-weight:700}.hero__title{letter-spacing:.01em;text-wrap:balance;margin-top:8px;font-size:clamp(30px,6vw,48px);line-height:1.25}.hero__lead{max-width:36em;color:var(--muted);text-wrap:pretty;margin-top:16px;font-size:clamp(15px,2.4vw,17px)}.hero__title,.hero__lead,.card__title,.card__summary{word-break:auto-phrase}.section-title{align-items:center;gap:10px;margin-bottom:20px;font-size:20px;display:flex}.section-title__count{background:var(--accent-soft);min-width:26px;color:var(--accent);text-align:center;border-radius:999px;padding:0 8px;font-size:13px;line-height:26px}.grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:20px;display:grid}.card{display:flex}.card__link{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);width:100%;box-shadow:var(--shadow);flex-direction:column;transition:transform .18s,border-color .18s;display:flex;overflow:hidden}.card__link:hover{border-color:var(--accent);transform:translateY(-3px)}.card__thumb{aspect-ratio:1200/630;object-fit:cover;border-bottom:1px solid var(--line);background:var(--accent-soft);width:100%}.card__body{flex-direction:column;flex:1;gap:8px;padding:16px 18px 18px;display:flex}.card__meta{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;font-size:12px;display:flex}.chip{background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:1px 10px;font-weight:700}.card__title{font-size:18px;line-height:1.4}.card__summary{color:var(--muted);font-size:14px;line-height:1.65}.tags{color:var(--muted);flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:4px;font-size:12px;display:flex}.tags li:before{content:"#";opacity:.6}.app-shell{flex-direction:column;height:100dvh;display:flex}.app-bar{min-height:48px;padding-inline:max(14px, env(safe-area-inset-left)) max(14px, env(safe-area-inset-right));padding-top:env(safe-area-inset-top);border-bottom:1px solid var(--line);background:var(--surface);flex:none;align-items:center;gap:12px;display:flex}.app-bar__home{font-size:16px}.app-bar__sep{color:var(--muted)}.app-bar__title{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:15px;line-height:1.3;overflow:hidden}.app-bar__action{border:1px solid var(--line);color:var(--muted);white-space:nowrap;border-radius:999px;flex:none;margin-left:auto;padding:6px 12px;font-size:13px}.app-bar__action:hover{border-color:var(--accent);color:var(--accent)}.app-frame{background:var(--bg);border:0;flex:1;width:100%;min-height:0;display:block}@media (max-width:480px){.app-bar__brand-text,.app-bar__sep{display:none}}.not-found{padding-block:clamp(48px,9vw,96px)}.not-found .button{margin-top:28px}@media (prefers-reduced-motion:reduce){.card__link{transition:none}.card__link:hover{transform:none}}
