CSS コンテナクエリ（@container）

実装: arm/v1/src/os_lib/css/container_query.rs（純粋モジュール・条件評価） ＋ arm/v1/src/os_lib/css/parser.rs（@container の解析・保持） ＋ arm/v1/src/os_lib/css/cascade.rs（カスケード時の動的評価） 試験: arm/v1/tests/src/test_container_query.rs（23 件）

変更前の状態

@container は未知のアットルールとして丸ごと破棄されていた （parser.rs の continue）。中のスタイルは一切適用されず、 コンテナクエリを使うページは指定が全部落ちた状態で描画されていた。

方針: 解析時に評価して落とさない

@media と同じく、条件はルールへタグ付けして保持し、 カスケードのたびに動的評価する。

これは 2026-07-24 の失敗に基づく。当時 @media を解析時に静的評価して ブロックごと捨てていたため、CSS 解析が走った一度きりの時点の ウィンドウ幅に永久固定され、モバイルファースト CSS のナビゲーションが 消えたままになった（ページが白紙同然になる一因）。 コンテナクエリは基準がコンテナ寸法で、レイアウトが決まるまで 値が分からないぶん、静的評価の害は @media より大きい。

不変条件

• CQ-1: 解釈できない条件は false（＝当てない）。 @media は互換性のため不明な条件を true へ倒す箇所があるが、 コンテナクエリは新しい構文であり、解釈できないものを適用すると 意図しないスタイルが当たる。安全側は「当てない」。
• CQ-2: 論理演算の結合強度は or < and < not。 A and B or C は (A and B) or C。
• CQ-3: 演算子は長いものから判定する（>= を > と誤解釈しない）。
• CQ-4: 文字列スライスは常に get() で境界安全に行う （&str の添字は UTF-8 境界を外すとパニックする）。
• CQ-5: 入れ子の @container は && で連結し、すべて満たす必要がある。

対応構文

• @container (min-width: 400px) … min-/max- 前置
• @container (width > 400px) … レンジ構文（> >= < <= =）
• @container card (min-width: 400px) … 名前付き（名前は保持するが未使用）
• and / or / not の論理結合、括弧の入れ子
• inline-size/block-size は横書き前提で width/height と同一視

既知の制約（重要）

コンテナ寸法は現在ビューポート寸法で代用している。

カスケードはレイアウトより前に、しかもツリー全体へ一度だけ走る構造の ため、「この要素にとっての問い合わせコンテナ」の寸法を要素ごとに 与えられない。CONTAINER_HINT_W/_H（layout/values.rs）を用意して あるが、現状レイアウト側から要素ごとに設定する経路は無く、 0 のときはビューポート寸法へフォールバックする。

結果として @container は実質 @media と同じ挙動になる。

• 最も外側のコンテナが実質ビューポート幅（body 直下の コンテナ等）である一般的なケースでは、期待どおりに動く。
• 入れ子のコンテナや、ビューポートより狭いコンテナでは 条件が緩く評価され、当たるべきでないスタイルが当たる。

CSS 仕様どおりにするには、カスケードを要素ごとにコンテナ寸法つきで 呼べるようにする（＝レイアウト後に再カスケードする 2 パス化）改修が要る。 container-type プロパティの解釈も未実装。

それでも「ブロックごと破棄して指定が全部落ちる」よりは、 一般的なケースで正しく当たる現状の方が実害が小さいと判断した。