feat: add DevSecOps comic field guide website

[hahwul]

Adds website/, a trilingual (EN / 한국어 / 日本語) educational site that teaches DevSecOps as an illustrated comic. Built with Hwaro; intended for devsecops.hahwul.com.

Draft while the domain and Pages settings are still to be configured.

What is in it

Homepage tells the story in one scroll: a prologue strip (Dev ships fast → the Bug sneaks in → Sec finds it three weeks late → "what if security joined on page one?"), a self-drawing infinity-loop diagram whose six nodes link to the chapters, character introductions, and six episode teasers.

Six chapter pages (/design/ … /operate/), each with a comic opening, the concepts for that phase, capability chips, one hands-on example (pytm, signed commits + branch protection, Gitleaks + Semgrep in CI, ZAP baseline, Trivy + kube-bench, Prowler), curated resources carried over from the README, the tools for that phase, and wrap-around navigation so Operate leads back to Design.

Tools page renders all 30 curated tools from data/tools.yml with phase filtering.

Content and structure

All content is sourced from the existing roadmap: the six phases and their capabilities come from DevSecOps.png, the resource links from README.md, and the tool list from tools/README.md. Nothing was invented. When tools are added to the repo table, they also need a row in data/tools.yml.

Each page exists three times (foo.md, foo.ko.md, foo.ja.md) with identical shortcode structure so translation diffs stay reviewable; UI strings live in i18n/{en,ko,ja}.toml. Korean and Japanese terminology follows README.ko.md and README.jp.md.

Design and accessibility

• Hand-drawn inline SVG cast (Dev, Sec, Ops, the Bug) with shading, highlights, and ground shadows. No text is baked into the SVG, so every line of dialogue stays translatable, selectable, and screen-reader friendly.
• Light and dark themes through light-dark() tokens. Character scenes pin color-scheme: light so illustrations read the same in both themes.
• Scroll reveals use one IntersectionObserver, gated behind .js and prefers-reduced-motion; no scroll listeners. Everything stays visible without JavaScript.
• System font stack with CJK coverage, so no webfont downloads.

Deployment

.github/workflows/deploy.yml builds website/ with the hahwul/hwaro action and publishes to gh-pages when files under website/** change. website/static/CNAME carries the custom domain.

Before this can be merged and go live:

• Point repo Settings → Pages at the gh-pages branch
• Add the DNS CNAME record for devsecops → hahwul.github.io

Verification

• hwaro build clean (27 pages), hwaro doctor reports no issues
• hwaro tool check-links passes on all 123 links
• Reviewed in light and dark, desktop and mobile, with reduced motion and with JavaScript disabled

Preview locally with cd website && hwaro serve.