atmos/os_lib/layout/

tree.rs

// 分割: layout.rs より機械的に移動（2026-07-16 リファクタ フェーズ4）。
// ロジック不変。可視性のみ pub(crate) へ昇格し、親が pub(crate) use で再エクスポート。
use super::*;

/// 計算量: **O(N × D)** — N はスタイル済みノード数、D は
/// テキストを含むノードでの行分割コスト（文字数に比例）。
///
/// ブロック整形は 1 パスだが、flex / grid コンテナは子の寸法を決めるのに
/// **子を 2 回走査**する（伸長・収縮の分配）。入れ子の深さぶん掛かるため
/// 深いフレックス入れ子では定数倍が増える。
///
/// 実測（sugi-lab.net: N=358）: 48〜89 tick。
/// `style_tree`（291 tick）の 1/4 以下で、**レイアウトの支配項ではない**。
pub fn layout_tree<'a>(node: &'a StyledNode<'a>, containing_block: Dimensions) -> LayoutBox<'a> {
    // 初期包含ブロック = ビューポート。absolute（positioned祖先なし）と fixed の基準。
    let icb = &containing_block.content;
    let icb_h = if icb.height > 0 {
        icb.height
    } else {
        VIEWPORT_HINT_H.load(AtomicOrdering::Relaxed)
    };
    abs_cb_set(icb.x, icb.y, icb.width, icb_h);
    VP_ORIGIN_X.store(icb.x, AtomicOrdering::Relaxed);
    VP_ORIGIN_Y.store(icb.y, AtomicOrdering::Relaxed);
    let mut layout_box = build_layout_tree(node);
    layout_box.layout(containing_block);
    layout_box
}

pub(crate) fn resolved_display<'a>(node: &'a StyledNode<'a>) -> &'a str {
    match &node.node.node_type {
        NodeType::Element { tag_name, .. } => node
            .value_ref("display")
            .unwrap_or_else(|| default_display_for(tag_name)),
        NodeType::Text(_) => "inline",
    }
}

pub(crate) fn build_layout_tree<'a>(node: &'a StyledNode<'a>) -> LayoutBox<'a> {
    let box_type = match &node.node.node_type {
        NodeType::Element { .. } => {
            let display = resolved_display(node);
            match display {
                "block" => BoxType::BlockNode(node),
                // inline-flex: 外側は inline-block として行に流し、内側は flex で組む
                // （`layout_inline_flex`。2026-09-26 まで InlineNode 扱いで子が flex 配置されなかった）。
                // inline-grid も同じ方式（外側 inline-block・内側 grid。2026-09-26 まで
                // block 扱いの GridNode で、前の文字の後ろに並ばず改行していた）。
                "inline-block" | "inline-flex" | "inline-grid" => BoxType::InlineBlockNode(node),
                "flex" => BoxType::FlexNode(node),
                "grid" => BoxType::GridNode(node),
                "table" => BoxType::TableNode(node),
                "table-row-group" => BoxType::TableRowGroupNode(node),
                "table-row" => BoxType::TableRowNode(node),
                "table-cell" => BoxType::TableCellNode(node),
                _ => BoxType::InlineNode(node), // "none" は下で除外
            }
        }
        NodeType::Text(_) => BoxType::InlineNode(node),
    };

    let mut layout_box = LayoutBox {
        dimensions: Dimensions::default(),
        box_type,
        children: Vec::new(),
    };

    for child in &node.children {
        if resolved_display(child) != "none" {
            // visibility: hidden — include in layout but mark invisible (handled in web_engine)
            layout_box.children.push(build_layout_tree(child));
        }
    }

    // テーブルの行グループ (thead/tbody/tfoot) は透過し、行 (tr) を table の直接の子へ引き上げる。
    // これにより layout_table は「table の子 = 行」という単純な前提で計算できる。
    if matches!(layout_box.box_type, BoxType::TableNode(_)) {
        let mut flattened: Vec<LayoutBox<'a>> = Vec::new();
        for child in layout_box.children.drain(..) {
            if matches!(child.box_type, BoxType::TableRowGroupNode(_)) {
                for row in child.children {
                    flattened.push(row);
                }
            } else {
                flattened.push(child);
            }
        }
        layout_box.children = flattened;
    }

    layout_box
}

/// スタイルから (margin, padding, border) を解決する（`%` は `containing_width` 基準）。
/// `init` の現在値を初期値にして、指定のある辺だけ上書きする（従来の
/// `apply_box_model_styles_with_base` と同じ意味。内在幅の計測でも使うため切り出した）。
pub(crate) fn style_box_edges(
    node: &StyledNode,
    containing_width: i32,
    init: &Dimensions,
) -> (EdgeSizes, EdgeSizes, EdgeSizes) {
    let mut margin = init.margin.clone();
    let mut padding = init.padding.clone();
    let mut border = init.border.clone();
    apply_box_value(
        node.value("margin"),
        &mut margin,
        containing_width,
    );
    apply_box_value(
        node.value("padding"),
        &mut padding,
        containing_width,
    );

    apply_edge_value(
        node.value("margin-top"),
        &mut margin.top,
        containing_width,
    );
    apply_edge_value(
        node.value("margin-right"),
        &mut margin.right,
        containing_width,
    );
    apply_edge_value(
        node.value("margin-bottom"),
        &mut margin.bottom,
        containing_width,
    );
    apply_edge_value(
        node.value("margin-left"),
        &mut margin.left,
        containing_width,
    );

    apply_edge_value(
        node.value("padding-top"),
        &mut padding.top,
        containing_width,
    );
    apply_edge_value(
        node.value("padding-right"),
        &mut padding.right,
        containing_width,
    );
    apply_edge_value(
        node.value("padding-bottom"),
        &mut padding.bottom,
        containing_width,
    );
    apply_edge_value(
        node.value("padding-left"),
        &mut padding.left,
        containing_width,
    );

    // border-width / border は単純に幅だけ扱う
    apply_box_value(
        node.value("border-width"),
        &mut border,
        containing_width,
    );
    if let Some(border_val) = node.value("border") {
        if let Some(px) = parse_px_like(&border_val) {
            border.top = px;
            border.right = px;
            border.bottom = px;
            border.left = px;
        }
    }
    apply_edge_value(
        node.value("border-top-width"),
        &mut border.top,
        containing_width,
    );
    apply_edge_value(
        node.value("border-right-width"),
        &mut border.right,
        containing_width,
    );
    apply_edge_value(
        node.value("border-bottom-width"),
        &mut border.bottom,
        containing_width,
    );
    apply_edge_value(
        node.value("border-left-width"),
        &mut border.left,
        containing_width,
    );
    (margin, padding, border)
}

/// 子の内在幅（min/max-content）の寄与を、子自身の `min-width`/`max-width`（px）で挟む
/// （CSS Sizing 3: 寄与は min/max-width で制限される）。`%` は基準が無いので無視。
/// 【2026-09-26】英語版ヒーローで、`max-width:800px` の hero-content の寄与が見出しの全長
/// （数千 px）のままになり、flex 項目が中央寄せで左へ大きくはみ出していた。
pub(crate) fn clamp_contribution(b: &LayoutBox, cmin: i32, cmax: i32) -> (i32, i32) {
    let px = |prop: &str| match parse_length_value(box_style_value(b, prop)) {
        Some(LengthValue::Px(v)) => Some(v.max(0)),
        _ => None,
    };
    let (mut lo, mut hi) = (cmin, cmax);
    if let Some(mx) = px("max-width") {
        lo = lo.min(mx);
        hi = hi.min(mx);
    }
    if let Some(mn) = px("min-width") {
        lo = lo.max(mn);
        hi = hi.max(mn);
    }
    (lo, hi.max(lo))
}

/// 内在幅の合計へ入れる、子の横方向の非 content 分（margin + border + padding）。
/// 【2026-09-26】従来は子の content 幅だけを足しており、入れ子の flex や
/// shrink-to-fit の箱が子の padding 分だけ狭く見積もられていた。
/// 明示幅が `box-sizing:border-box` のときは padding/border が幅に含まれるので margin だけ。
pub(crate) fn intrinsic_h_edges(b: &LayoutBox, explicit_width: bool) -> i32 {
    let node = match &b.box_type {
        BoxType::BlockNode(n)
        | BoxType::InlineBlockNode(n)
        | BoxType::FlexNode(n)
        | BoxType::GridNode(n)
        | BoxType::TableNode(n) => *n,
        _ => return 0,
    };
    // 内在幅の計測中は包含幅が未確定なので `%` は 0 扱い。
    let (m, p, bd) = style_box_edges(node, 0, &Dimensions::default());
    let margins = m.left.max(0) + m.right.max(0);
    let border_box = explicit_width
        && node.value("box-sizing").map(|v| v.trim() == "border-box").unwrap_or(false);
    if border_box {
        margins
    } else {
        margins + p.left + p.right + bd.left + bd.right
    }
}

/// 文字ノードの書体指定（font-family のリスト, 太字か）。描画側と同じ判定
/// （font-weight が bold/bolder/700 以上なら太字）。
fn text_font_of(node: &StyledNode) -> (String, bool) {
    let fam = node.value("font-family").map(|v| String::from(v.trim())).unwrap_or_default();
    let bold = node
        .value("font-weight")
        .map(|v| {
            let t = v.trim().to_lowercase();
            t == "bold" || t == "bolder" || t.parse::<u32>().unwrap_or(400) >= 700
        })
        .unwrap_or(false);
    (fam, bold)
}

impl<'a> LayoutBox<'a> {
    /// 明示の px 高さを content 高に換算して返す（`box-sizing:border-box` なら
    /// 縦の padding/border を引く）。明示 px でなければ None。
    /// 【2026-09-26】flex コンテナが border-box の明示高さをそのまま content 高に使い、
    /// padding 分だけ背が高くなっていた（`*{box-sizing:border-box}` のサイト全般）。
    fn explicit_content_height_px(&self, height_val: Option<String>) -> Option<i32> {
        let Some(LengthValue::Px(px)) = parse_length_value(height_val) else {
            return None;
        };
        let border_box = box_style_value(self, "box-sizing")
            .map(|v| v.trim() == "border-box")
            .unwrap_or(false);
        if border_box {
            let d = &self.dimensions;
            Some((px - d.padding.top - d.padding.bottom - d.border.top - d.border.bottom).max(0))
        } else {
            Some(px.max(0))
        }
    }

    /// 横方向の content 以外（margin + border + padding の左右合計）。
    fn h_non_content(&self) -> i32 {
        let d = &self.dimensions;
        d.margin.left + d.margin.right + d.border.left + d.border.right + d.padding.left + d.padding.right
    }

    /// 行内で content の外側に占める (左, 右, 上, 下) の幅（margin+border+padding）。
    /// inline-block（inline-flex 含む）のみ。素の inline 要素は box model 自体が
    /// 未適用（常に 0）なので従来どおり 0。レイアウト後に呼ぶこと。
    fn inline_block_edges(&self) -> (i32, i32, i32, i32) {
        if !matches!(self.box_type, BoxType::InlineBlockNode(_)) {
            return (0, 0, 0, 0);
        }
        let d = &self.dimensions;
        (
            d.margin.left + d.border.left + d.padding.left,
            d.margin.right + d.border.right + d.padding.right,
            d.margin.top + d.border.top + d.padding.top,
            d.margin.bottom + d.border.bottom + d.padding.bottom,
        )
    }

    /// `display: inline-flex` の箱か（外側 InlineBlockNode・内側 flex）。
    fn is_inline_flex(&self) -> bool {
        match &self.box_type {
            BoxType::InlineBlockNode(n) => resolved_display(n).trim() == "inline-flex",
            _ => false,
        }
    }

    /// `display: inline-grid` の箱か（外側 InlineBlockNode・内側 grid）。
    fn is_inline_grid(&self) -> bool {
        match &self.box_type {
            BoxType::InlineBlockNode(n) => resolved_display(n).trim() == "inline-grid",
            _ => false,
        }
    }

    /// inline-flex の content 幅: 明示幅があればそれ、無ければ shrink-to-fit
    /// （flex 行の max-content を利用幅で頭打ち。下限は min-content）。
    fn inline_flex_content_width(&self, avail: i32) -> i32 {
        if let BoxType::InlineBlockNode(node) = &self.box_type {
            if let Some(w) = parse_length_value(node.value("width"))
                .and_then(|v| resolve_length_value(v, avail.max(0)))
            {
                return w.max(0);
            }
        }
        let (minc, maxc) = self.block_intrinsic_widths();
        let d = &self.dimensions;
        let non_content = d.margin.left + d.margin.right + d.border.left + d.border.right
            + d.padding.left + d.padding.right;
        maxc.min((avail - non_content).max(0)).max(minc).max(0)
    }

    /// 自身を flex コンテナとして content 幅 `content_w`・content 原点 (x, y) に組む。
    /// `layout_flex` は FlexNode しか受け付けないので、その間だけ型を差し替える。
    fn layout_as_flex_at(&mut self, x: i32, y: i32, content_w: i32) {
        let BoxType::InlineBlockNode(node) = self.box_type else {
            return;
        };
        let as_grid = self.is_inline_grid();
        self.box_type = if as_grid { BoxType::GridNode(node) } else { BoxType::FlexNode(node) };
        let d = &self.dimensions;
        let left = d.margin.left + d.border.left + d.padding.left;
        let top = d.margin.top + d.border.top + d.padding.top;
        let h_non = left + d.padding.right + d.border.right + d.margin.right;
        let cb = Dimensions {
            content: Rect { x: x - left, y: y - top, width: content_w + h_non, height: 0 },
            ..Default::default()
        };
        if as_grid {
            self.layout_grid(cb);
        } else {
            self.layout_flex(cb);
        }
        self.box_type = BoxType::InlineBlockNode(node);
    }

    /// `display: inline-flex` のレイアウト。位置の決め方は `layout_inline` と同じ
    /// （cb の content 原点 + 縦カーソル + margin/border/padding）で、親が最後に
    /// スロット位置へ子孫ごと平行移動する。
    fn layout_inline_flex(&mut self, containing_block: Dimensions) {
        self.apply_box_model_styles_with_base(containing_block.content.width);
        let w = self.inline_flex_content_width(containing_block.content.width.max(1));
        let d = &self.dimensions;
        let x = containing_block.content.x + d.margin.left + d.border.left + d.padding.left;
        let y = containing_block.content.y
            + containing_block.content.height
            + d.margin.top
            + d.border.top
            + d.padding.top;
        self.layout_as_flex_at(x, y, w);
    }

    /// 自身と全子孫の絶対 y 座標を dy だけ平行移動する（table セルの `vertical-align` 実装用）。
    /// 各ボックスの content.y は既に絶対ピクセル座標として確定しているため、
    /// この再帰1回で子孫すべての位置がまとめてずれる。
    fn translate_y(&mut self, dy: i32) {
        if dy == 0 {
            return;
        }
        self.dimensions.content.y += dy;
        for child in &mut self.children {
            child.translate_y(dy);
        }
    }

    /// 自身と全子孫の絶対座標を (dx, dy) だけ平行移動する。
    ///
    /// 多段組で「通常フローで積み終えた子を列の位置へ移す」ために使う。
    /// `translate_y` の 2 軸版で、考え方は同じ（content 座標が絶対値なので
    /// 再帰 1 回で子孫がまとめてずれる）。
    fn translate(&mut self, dx: i32, dy: i32) {
        if dx == 0 && dy == 0 {
            return;
        }
        self.dimensions.content.x += dx;
        self.dimensions.content.y += dy;
        for child in &mut self.children {
            child.translate(dx, dy);
        }
    }

    /// `indices` で指定した caption 群を y から順に縦積みでレイアウトし、消費した合計高さを返す。
    /// `caption-side:top`（既定）/`bottom` どちらの配置にも使う共通ヘルパー。
    fn layout_captions_at(&mut self, indices: &[usize], base_x: i32, y: i32, width: i32) -> i32 {
        let mut consumed = 0i32;
        for &ci in indices {
            let cap_y = y + consumed;
            let cap = &mut self.children[ci];
            let mut cb = Dimensions::default();
            cb.content.x = base_x;
            cb.content.y = cap_y;
            cb.content.height = 0;
            cb.content.width = width;
            cap.layout(cb);
            consumed += cap.dimensions.margin_box().height;
        }
        consumed
    }

    fn layout(&mut self, containing_block: Dimensions) {
        match &self.box_type {
            BoxType::BlockNode(_) => self.layout_block(containing_block),
            BoxType::InlineNode(_) => self.layout_inline(containing_block, false),
            BoxType::InlineBlockNode(_) if self.is_inline_flex() || self.is_inline_grid() => {
                self.layout_inline_flex(containing_block)
            }
            BoxType::InlineBlockNode(_) => self.layout_inline(containing_block, true),
            BoxType::FlexNode(_) => self.layout_flex(containing_block),
            BoxType::GridNode(_) => self.layout_grid(containing_block),
            BoxType::TableNode(_) => self.layout_table(containing_block),
            // 行グループ・行・セルは table 経由でレイアウトされる。
            // 単独で呼ばれた場合 (table の外にある等) は block としてフォールバック。
            BoxType::TableRowGroupNode(_)
            | BoxType::TableRowNode(_)
            | BoxType::TableCellNode(_) => self.layout_block(containing_block),
            BoxType::AnonymousBlock => {}
        }
    }

    /// この要素が positioned（relative/absolute/fixed）なら、子孫 absolute の包含ブロック
    /// （ABS_CB）を self の content box に切替え、切替前の値を返す。戻り値は
    /// `restore_abs_cb` に渡して復元する。非 positioned なら None。
    /// content.width / content.height が確定済みであることを前提とする（bottom/right 解決のため）。
    fn establish_abs_cb(&self) -> Option<(i32, i32, i32, i32)> {
        if matches!(
            box_position(self).as_str(),
            "relative" | "absolute" | "fixed"
        ) {
            let prev = abs_cb_get();
            abs_cb_set(
                self.dimensions.content.x,
                self.dimensions.content.y,
                self.dimensions.content.width,
                self.dimensions.content.height,
            );
            Some(prev)
        } else {
            None
        }
    }

    /// `establish_abs_cb` の戻り値を使って ABS_CB を元に戻す。
    fn restore_abs_cb(saved: Option<(i32, i32, i32, i32)>) {
        if let Some(prev) = saved {
            abs_cb_set(prev.0, prev.1, prev.2, prev.3);
        }
    }

    /// 子のうち out-of-flow（absolute / fixed）なものを判定するヘルパ。
    fn child_is_out_of_flow(child: &LayoutBox) -> bool {
        matches!(box_position(child).as_str(), "absolute" | "fixed")
    }

    /// position 後処理。全フォーマッティングコンテキスト（block/flex/grid/table）で共有。
    /// - relative: フロー確定位置から top/left（または bottom/right の符号反転）でオフセット。
    /// - absolute: 最近傍 positioned 祖先（ABS_CB、昇り解決済み）基準で top/left/right/bottom 配置。
    /// - fixed: ビューポート原点基準で配置。
    /// - transform: translate を最後に視覚シフトとして適用（兄弟は再フローしない＝仕様通り）。
    ///
    /// self.dimensions.content.{width,height} が確定済みであることを前提とする。
    fn apply_positioned_offsets(&mut self) {
        let cw = self.dimensions.content.width;
        let ch = self.dimensions.content.height;
        for child in &mut self.children {
            match box_position(child).as_str() {
                "relative" => {
                    let dx = box_inset_len(child, "left", cw)
                        .or_else(|| box_inset_len(child, "right", cw).map(|r| -r))
                        .unwrap_or(0);
                    let dy = box_inset_len(child, "top", ch)
                        .or_else(|| box_inset_len(child, "bottom", ch).map(|b| -b))
                        .unwrap_or(0);
                    if dx != 0 || dy != 0 {
                        shift_layout_box(child, dx, dy);
                    }
                }
                pos @ ("absolute" | "fixed") => {
                    // 基準矩形: absolute=ABS_CB（昇り解決済み）、fixed=ビューポート原点。
                    let (bx, by, bw, bh) = if pos == "fixed" {
                        let (vx, vy) = vp_origin_get();
                        (
                            vx,
                            vy,
                            VIEWPORT_HINT_W.load(AtomicOrdering::Relaxed),
                            VIEWPORT_HINT_H.load(AtomicOrdering::Relaxed),
                        )
                    } else {
                        abs_cb_get()
                    };
                    // 【2026-09-26 バグ修正】幅 auto の絶対配置は、left と right が両方あれば
                    // 包含ブロックから幅を決め、そうでなければ内容幅に縮む（shrink-to-fit。
                    // CSS 2.1 §10.3.7）。従来は通常フローと同じく親の幅いっぱいに組まれ、
                    // 実サイトのヒーロー下部の矢印（left:50% + translateX(-50%)）が左端に出ていた。
                    let block_like = matches!(
                        child.box_type,
                        BoxType::BlockNode(_) | BoxType::FlexNode(_) | BoxType::GridNode(_)
                    );
                    if block_like && !box_has_explicit(child, "width") {
                        let h_non = child.h_non_content();
                        let l = box_inset_len(child, "left", bw);
                        let r = box_inset_len(child, "right", bw);
                        let target = match (l, r) {
                            (Some(l), Some(r)) => (bw - l - r - h_non).max(0),
                            _ => {
                                let (minc, maxc) = child.block_intrinsic_widths();
                                let avail = (bw - l.or(r).unwrap_or(0) - h_non).max(0);
                                maxc.min(avail).max(minc).max(0)
                            }
                        };
                        if target != child.dimensions.content.width {
                            let mb0 = child.dimensions.margin_box();
                            let cb = Dimensions {
                                content: Rect { x: mb0.x, y: mb0.y, width: target + h_non, height: 0 },
                                ..Default::default()
                            };
                            child.layout(cb);
                        }
                    }
                    let mb = child.dimensions.margin_box();
                    let tx = if let Some(l) = box_inset_len(child, "left", bw) {
                        bx + l
                    } else if let Some(r) = box_inset_len(child, "right", bw) {
                        bx + bw - r - mb.width
                    } else {
                        bx
                    };
                    let ty = if let Some(t) = box_inset_len(child, "top", bh) {
                        by + t
                    } else if let Some(b) = box_inset_len(child, "bottom", bh) {
                        by + bh - b - mb.height
                    } else {
                        by
                    };
                    shift_layout_box(child, tx - mb.x, ty - mb.y);
                }
                _ => {}
            }

            // transform: translate（レイアウト確定後の視覚シフト。position の後に適用、
            // 兄弟は再フローしない＝仕様通り）。% は要素自身の content 寸法基準。
            let (txx, tyy) = box_translate(child);
            if txx != 0 || tyy != 0 {
                shift_layout_box(child, txx, tyy);
            }
        }
    }

    /// テーブルレイアウト (RFC 風の簡易固定/自動テーブル)。
    /// - 列数 = 最大セル数の行
    /// - 列幅 = 各列セルの intrinsic 幅の最大値。総和が利用幅を超えたら比例縮小、
    ///   下回ったら余りを均等配分して幅いっぱいに広げる
    /// - 各行は縦に積み、行内のセルは列幅で横並び、行高さ = セル最大高さに揃える
    // ===== CSS Grid レイアウト =====
    fn layout_grid(&mut self, containing_block: Dimensions) {
        self.apply_box_model_styles_with_base(containing_block.content.width);

        let node = match &self.box_type {
            BoxType::GridNode(n) => *n,
            _ => return,
        };
        let avail_w = containing_block.content.width.max(1);

        // box-sizing / margin:auto 適用（block と同じロジック）。
        let inner_non_content = self.dimensions.border.left
            + self.dimensions.border.right
            + self.dimensions.padding.left
            + self.dimensions.padding.right;
        let h_non_content =
            self.dimensions.margin.left + self.dimensions.margin.right + inner_non_content;
        let width_val = node.value("width");
        let box_sizing = node.value("box-sizing").unwrap_or_default();
        let h_auto = margin_is_h_auto(node);
        let explicit_w =
            !matches!(parse_length_value(width_val.clone()), Some(LengthValue::Auto) | None);
        let mut content_w = match parse_length_value(width_val) {
            Some(LengthValue::Auto) | None => (avail_w - h_non_content).max(1),
            Some(LengthValue::Px(px)) => px.max(1),
            Some(LengthValue::Percent(pct)) => round_f32_to_i32(avail_w as f32 * pct).max(1),
            Some(LengthValue::MinContent) => {
                let (minc, _maxc) = self.block_intrinsic_widths();
                minc.max(1)
            }
            Some(LengthValue::MaxContent) => {
                let (_minc, maxc) = self.block_intrinsic_widths();
                maxc.max(1)
            }
            Some(LengthValue::FitContent) => {
                let (minc, maxc) = self.block_intrinsic_widths();
                let avail = (avail_w - h_non_content).max(0);
                avail.min(maxc).max(minc).max(1)
            }
            Some(LengthValue::MathExpr(expr)) => {
                crate::os_lib::css::eval_css_math(&expr, avail_w)
                    .unwrap_or((avail_w - h_non_content).max(1))
                    .max(1)
            }
        };
        // 【2026-09-26】border-box は明示幅のときだけ（auto 幅は既に padding を
        // 除いた残りなので、引くと二重に引かれる）。min/max-width も適用する
        // （従来は無視されており `max-width + margin:auto` の中央寄せが効かなかった）。
        if explicit_w && box_sizing.trim() == "border-box" {
            content_w = (content_w - inner_non_content).max(1);
        }
        if let Some(min_w) = self.resolve_sizing_value(node.value("min-width"), avail_w) {
            content_w = content_w.max(min_w);
        }
        if let Some(max_w) = self.resolve_sizing_value(node.value("max-width"), avail_w) {
            content_w = content_w.min(max_w);
        }
        let content_w = content_w.max(1);
        self.dimensions.content.width = content_w;
        if h_auto {
            let free = (avail_w - content_w - inner_non_content).max(0);
            self.dimensions.margin.left = free / 2;
            self.dimensions.margin.right = free / 2;
        }

        let flow_y = containing_block.content.y
            + containing_block.content.height
            + self.dimensions.margin.top;
        self.dimensions.content.x = containing_block.content.x
            + self.dimensions.margin.left
            + self.dimensions.border.left
            + self.dimensions.padding.left;
        self.dimensions.content.y =
            flow_y + self.dimensions.border.top + self.dimensions.padding.top;

        let (row_gap, col_gap) = {
            // px / % 両対応の gap 解決（% は content 幅基準）。
            let gpx = |s: &str| -> i32 {
                match parse_length_value(Some(String::from(s.trim()))) {
                    Some(LengthValue::Px(p)) => p,
                    Some(LengthValue::Percent(pct)) => {
                        round_f32_to_i32(content_w as f32 * pct).max(0)
                    }
                    _ => 0,
                }
            };

            let gap_all = node.value("gap").unwrap_or_default();
            if !gap_all.is_empty() {
                let toks: Vec<&str> = gap_all.split_whitespace().collect();
                let rg = gpx(toks.first().copied().unwrap_or("0"));
                let cg = gpx(toks
                    .get(1)
                    .copied()
                    .unwrap_or(toks.first().copied().unwrap_or("0")));
                (rg, cg)
            } else {
                let rg = node
                    .value("row-gap")
                    .or_else(|| node.value("grid-row-gap"))
                    .map(|v| gpx(&v))
                    .unwrap_or(0);
                let cg = node
                    .value("column-gap")
                    .or_else(|| node.value("grid-column-gap"))
                    .map(|v| gpx(&v))
                    .unwrap_or(0);
                (rg, cg)
            }
        };

        // grid-template-columns を解析して列幅の Vec を作る。
        // 列間 gap を先に解決して渡す（2026-09-26 まで gap を無視して列幅を決めていた）。
        let mut col_widths = parse_grid_template_columns_gap(
            node.value("grid-template-columns").as_deref().unwrap_or(""),
            content_w,
            col_gap,
        );
        let n_cols = col_widths.len().max(1);

        // grid-auto-columns: 暗黙列（`grid-auto-flow: column` が明示列数を使い切って
        // 新規に作る列）のサイズ。複数値は循環適用。px/minmax の下限のみを解決し、
        // fr/auto は「最後の明示列と同じ幅」にフォールバックする簡略実装
        // （暗黙列の内容ベースの自動採寸は行わない。行側の grid-auto-rows のような
        // 内容実測パスをそのまま列へ持ち込むのは改修規模が大きいための割り切り）。
        let auto_col_tracks = parse_grid_tracks(
            node.value("grid-auto-columns").as_deref().unwrap_or(""),
            content_w,
        );
        let auto_col_fallback_px = col_widths.last().copied().unwrap_or(100).max(1);
        let resolve_auto_col_px = |idx: usize| -> i32 {
            if auto_col_tracks.is_empty() {
                return auto_col_fallback_px;
            }
            match auto_col_tracks[idx % auto_col_tracks.len()] {
                GridTrack::Px(px) => px.max(1),
                GridTrack::MinMax { min_px, .. } => min_px.max(1),
                _ => auto_col_fallback_px,
            }
        };

        // grid-template-areas: 名前付き領域を grid-area で参照するための行×列テーブル。
        let template_areas =
            parse_grid_template_areas(node.value("grid-template-areas").as_deref().unwrap_or(""));

        // grid-template-rows/grid-auto-rows の `%` トラック解決基準。明示 height
        // （px/%）があればそれを使い、無指定/auto は 0（`%` トラックは 0 扱い、
        // 高さがコンテンツから決まる場合の一般的な簡略化）とする。以前はここが常に
        // 固定値 0 で、明示 height を指定していても `grid-template-rows:50%` 等が
        // 常に 0px に丸め込まれるバグがあった（列側は content_w を正しく渡していたのに
        // 行側だけ取り残されていた）。
        let row_base = match parse_length_value(node.value("height")) {
            Some(LengthValue::Px(px)) => px.max(0),
            Some(LengthValue::Percent(pct)) => {
                round_f32_to_i32(containing_block.content.height as f32 * pct).max(0)
            }
            _ => 0,
        };

        // 明示 grid-template-rows トラック定義（px/fr/auto）。空なら全行 auto 扱い。
        let row_tracks = parse_grid_tracks(
            node.value("grid-template-rows").as_deref().unwrap_or(""),
            row_base,
        );

        // grid-auto-rows: 暗黙行（明示トラック数を超えた行）のサイズ。複数値は循環適用。
        let auto_row_tracks = parse_grid_tracks(
            node.value("grid-auto-rows").as_deref().unwrap_or(""),
            row_base,
        );

        // 行 r の実効トラックを返す: 明示トラックがあればそれ、無ければ grid-auto-rows を循環。
        let eff_row_track = |r: usize| -> Option<GridTrack> {
            if let Some(t) = row_tracks.get(r) {
                return Some(*t);
            }
            if auto_row_tracks.is_empty() {
                return None;
            }
            let implicit_idx = r - row_tracks.len();
            auto_row_tracks
                .get(implicit_idx % auto_row_tracks.len())
                .copied()
        };

        // コンテナの justify-items（インライン=列軸）/ align-items（ブロック=行軸）。
        // 既定 stretch。各アイテムの justify-self / align-self が優先する。
        let justify_items = node
            .value("justify-items")
            .unwrap_or_else(|| String::from("stretch"))
            .trim()
            .to_lowercase();
        let align_items = node
            .value("align-items")
            .unwrap_or_else(|| String::from("stretch"))
            .trim()
            .to_lowercase();

        // ---- パス1: 配置の解決（占有マップ + auto-flow row/column） ----
        // 各フロー子の (row, col, row_span, col_span) を確定。out-of-flow は別管理。
        // grid-auto-flow: column なら列優先（grid-template-rows の行数を縦に埋めてから次列へ）。
        let auto_flow_col = node
            .value("grid-auto-flow")
            .map(|v| v.to_lowercase().contains("column"))
            .unwrap_or(false);
        // 列優先時の行数上限（明示 grid-template-rows の本数。無ければ 1）。
        let flow_rows = row_tracks.len().max(1);
        let mut occ: Vec<Vec<bool>> = Vec::new();
        // `grid-auto-flow: column` が明示列数を使い切って新規に列を作った実際の列数。
        // 以前はこれが常に固定の n_cols のままで、`grid_cells_free` が
        // `c + col_span > n_cols` で常に false を返し続けるため、列優先フローで
        // 明示列数を超える個数のアイテムを配置しようとすると無限ループしてハングする
        // バグがあった。
        let mut n_cols_dyn = n_cols;
        // 子のインデックス → 配置（フロー子のみ）。
        let n_children = self.children.len();
        let mut placement: Vec<Option<(usize, usize, usize, usize)>> =
            alloc::vec![None; n_children];
        let mut cursor_r = 0usize;
        let mut cursor_c = 0usize;
        for (idx, child) in self.children.iter().enumerate() {
            if Self::child_is_out_of_flow(child) {
                continue;
            }
            let (mut col_start, mut col_span_raw) =
                grid_axis_placement(child, "grid-column", "grid-column-start", "grid-column-end");
            let (mut row_start, mut row_span_raw) =
                grid_axis_placement(child, "grid-row", "grid-row-start", "grid-row-end");
            // grid-column/grid-row が未指定（auto）の場合のみ、grid-area 名を
            // grid-template-areas から解決してフォールバックする。
            if col_start.is_none() && row_start.is_none() {
                if let Some(area_name) = box_style_value(child, "grid-area") {
                    let area_name = area_name.trim();
                    if !area_name.is_empty() {
                        if let Some((ar, ac, arspan, acspan)) =
                            find_grid_area(&template_areas, area_name)
                        {
                            row_start = Some(ar);
                            col_start = Some(ac);
                            row_span_raw = arspan;
                            col_span_raw = acspan;
                        }
                    }
                }
            }
            let col_span = col_span_raw.min(n_cols).max(1);
            let row_span = row_span_raw.max(1);

            // 配置位置の決定。明示があれば尊重、無ければ auto-flow（行優先）。
            let (r, c) = match (row_start, col_start) {
                (Some(r), Some(c)) => (r, c.min(n_cols.saturating_sub(1))),
                (Some(r), None) => {
                    // 行固定・列 auto: その行で空く最初の列。
                    grid_ensure_row(&mut occ, r + row_span - 1, n_cols);
                    let mut cc = 0usize;
                    while cc < n_cols && !grid_cells_free(&occ, r, cc, row_span, col_span, n_cols) {
                        cc += 1;
                    }
                    (r, cc.min(n_cols.saturating_sub(1)))
                }
                (None, Some(c)) => {
                    // 列固定・行 auto: カーソル行以降で空く最初の行。
                    let c = c.min(n_cols.saturating_sub(1));
                    let mut rr = cursor_r;
                    loop {
                        grid_ensure_row(&mut occ, rr + row_span - 1, n_cols);
                        if grid_cells_free(&occ, rr, c, row_span, col_span, n_cols) {
                            break;
                        }
                        rr += 1;
                    }
                    (rr, c)
                }
                (None, None) => {
                    if auto_flow_col {
                        // 列優先: (cursor_r, cursor_c) から行を縦に進め、flow_rows を超えたら
                        // 次の列の先頭へ。空きセルが見つかるまで走査する。
                        // 明示列数（n_cols）を使い切ったら grid-auto-columns で新規に
                        // 列を作る（n_cols_dyn を伸ばす）。これをしないと
                        // grid_cells_free が `c + col_span > n_cols` で恒久的に false を
                        // 返し続け、無限ループでハングする。
                        let mut rr = cursor_r;
                        let mut cc = cursor_c;
                        loop {
                            if rr + row_span > flow_rows {
                                cc += 1;
                                rr = 0;
                            }
                            if cc + col_span > n_cols_dyn {
                                n_cols_dyn = cc + col_span;
                                grid_ensure_col(&mut occ, n_cols_dyn);
                            }
                            grid_ensure_row(&mut occ, rr + row_span - 1, n_cols_dyn);
                            if grid_cells_free(&occ, rr, cc, row_span, col_span, n_cols_dyn) {
                                break;
                            }
                            rr += 1;
                        }
                        cursor_r = rr + row_span;
                        cursor_c = cc;
                        (rr, cc)
                    } else {
                        // 行優先: カーソルから次の空きへ。
                        let mut rr = cursor_r;
                        let mut cc = cursor_c;
                        loop {
                            if cc + col_span > n_cols {
                                rr += 1;
                                cc = 0;
                            }
                            grid_ensure_row(&mut occ, rr + row_span - 1, n_cols);
                            if grid_cells_free(&occ, rr, cc, row_span, col_span, n_cols) {
                                break;
                            }
                            cc += 1;
                        }
                        cursor_r = rr;
                        cursor_c = cc + col_span;
                        (rr, cc)
                    }
                }
            };
            grid_ensure_row(&mut occ, r + row_span - 1, n_cols_dyn);
            grid_mark(&mut occ, r, c, row_span, col_span, n_cols_dyn);
            placement[idx] = Some((r, c, row_span, col_span));
        }

        // grid-auto-flow: column が明示列数を使い切って新しい列を作った分だけ、
        // col_widths を grid-auto-columns（未指定なら最後の明示列と同じ幅）で伸ばす。
        while col_widths.len() < n_cols_dyn {
            let idx = col_widths.len() - n_cols;
            col_widths.push(resolve_auto_col_px(idx));
        }

        // グリッドコンテナの `justify-content`: トラック総幅がコンテナ幅より
        // 小さい場合に、トラック集合全体をどう配置するか（flexbox の主軸
        // justify-content と同じ考え方。以前はここが完全に未実装で、
        // トラック合計がコンテナ幅に満たなくても常に左詰めに固定されていた）。
        let n_cols_eff = col_widths.len();
        let cols_total: i32 =
            col_widths.iter().sum::<i32>() + (n_cols_eff.saturating_sub(1) as i32) * col_gap;
        let cols_free = (content_w - cols_total).max(0);
        let justify_content_grid = node
            .value("justify-content")
            .unwrap_or_default()
            .trim()
            .to_lowercase();
        let (col_start_offset, col_extra_gap) = if cols_free > 0 && n_cols_eff > 0 {
            match justify_content_grid.as_str() {
                "end" | "flex-end" => (cols_free, 0),
                "center" => (cols_free / 2, 0),
                "space-between" if n_cols_eff > 1 => (0, cols_free / (n_cols_eff as i32 - 1)),
                "space-around" if n_cols_eff > 0 => {
                    let g = cols_free / n_cols_eff as i32;
                    (g / 2, g)
                }
                "space-evenly" if n_cols_eff > 0 => {
                    let g = cols_free / (n_cols_eff as i32 + 1);
                    (g, g)
                }
                _ => (0, 0),
            }
        } else {
            (0, 0)
        };
        let col_gap_eff = col_gap + col_extra_gap;

        let n_rows = occ.len().max(row_tracks.len());

        // ---- パス2: 子を仮レイアウト（列幅基準）して各行の自然高さを測定 ----
        // 行高さ（row_heights[r]）を、明示トラックと span=1 アイテムの実測で決める。
        let mut row_heights: Vec<i32> = alloc::vec![0; n_rows];
        // まず明示 px / % トラック、および minmax の min_px 下限を反映（暗黙行は grid-auto-rows）。
        for (r, h) in row_heights.iter_mut().enumerate() {
            match eff_row_track(r) {
                Some(GridTrack::Px(px)) => *h = px.max(0),
                Some(GridTrack::MinMax { min_px, .. }) => *h = min_px.max(0),
                _ => {}
            }
        }
        // 子を一旦レイアウトして高さ実測（span=1 のみが行高さに寄与）。
        // ここでは x 位置だけ正しく与え、y は後で確定するため 0 起点で測る。
        let base_x = self.dimensions.content.x;
        let base_y = self.dimensions.content.y;
        for (idx, child) in self.children.iter_mut().enumerate() {
            if Self::child_is_out_of_flow(child) {
                continue;
            }
            let Some((_r, c, _rs, cs)) = placement[idx] else {
                continue;
            };
            let cell_w = grid_span_width(&col_widths, col_gap_eff, c, cs);
            let cell_cb = Dimensions {
                content: Rect {
                    x: base_x + col_start_offset + grid_col_x(&col_widths, col_gap_eff, c),
                    y: base_y,
                    width: cell_w,
                    height: 0,
                },
                ..Dimensions::default()
            };
            child.layout(cell_cb);
        }
        // 行の自然高さ（auto トラック）を span=1 アイテムの実測から求める。
        for (idx, child) in self.children.iter().enumerate() {
            let Some((r, _c, rs, _cs)) = placement[idx] else {
                continue;
            };
            if rs != 1 {
                continue;
            }
            let explicit_px = matches!(eff_row_track(r), Some(GridTrack::Px(_)));
            if explicit_px {
                continue;
            }
            let ch = child.dimensions.margin_box().height;
            if let Some(h) = row_heights.get_mut(r) {
                *h = (*h).max(ch);
            }
            // minmax の max が px（非fr・非auto）なら上限でクランプ。
            if let Some(GridTrack::MinMax {
                max_px,
                max_is_fr,
                max_is_auto,
                ..
            }) = eff_row_track(r)
            {
                if !max_is_fr && !max_is_auto {
                    if let Some(h) = row_heights.get_mut(r) {
                        *h = (*h).min(max_px);
                    }
                }
            }
        }
        // span>1 アイテムが行高さ合計を超える場合、末尾行を伸ばす。
        for (idx, child) in self.children.iter().enumerate() {
            let Some((r, _c, rs, _cs)) = placement[idx] else {
                continue;
            };
            if rs <= 1 {
                continue;
            }
            let ch = child.dimensions.margin_box().height;
            let mut covered = 0i32;
            for rr in r..(r + rs).min(row_heights.len()) {
                covered += row_heights.get(rr).copied().unwrap_or(0);
            }
            covered += (rs.saturating_sub(1) as i32) * row_gap;
            if ch > covered {
                let last = (r + rs - 1).min(row_heights.len().saturating_sub(1));
                if let Some(h) = row_heights.get_mut(last) {
                    *h += ch - covered;
                }
            }
        }

        // fr 行トラックの解決（コンテナに明示高さがある場合のみ余白を fr へ分配）。
        let mut container_h_explicit: Option<i32> = None;
        let height_val = node.value("height");
        if let Some(h) = parse_length_value(height_val.clone())
            .and_then(|v| resolve_length_value(v, containing_block.content.height.max(0)))
        {
            let vert_non = self.dimensions.border.top
                + self.dimensions.border.bottom
                + self.dimensions.padding.top
                + self.dimensions.padding.bottom;
            container_h_explicit = Some(if box_sizing.trim() == "border-box" {
                (h - vert_non).max(0)
            } else {
                h.max(0)
            });
        }
        if let Some(ch) = container_h_explicit {
            // fr 係数（純 Fr + minmax の fr max）。
            let track_fr = |t: &GridTrack| -> f32 {
                match t {
                    GridTrack::Fr(f) => *f,
                    GridTrack::MinMax {
                        max_fr, max_is_fr, ..
                    } if *max_is_fr => *max_fr,
                    _ => 0.0,
                }
            };
            // 暗黙行（grid-auto-rows）も含めて全行を走査。
            let mut fr_total = 0.0f32;
            for r in 0..n_rows {
                if let Some(t) = eff_row_track(r) {
                    fr_total += track_fr(&t);
                }
            }
            if fr_total > 0.0 {
                let mut used = 0i32;
                for (r, h) in row_heights.iter().enumerate() {
                    let is_fr = eff_row_track(r).map(|t| track_fr(&t)).unwrap_or(0.0) > 0.0;
                    if !is_fr {
                        used += *h;
                    }
                }
                used += (n_rows.saturating_sub(1) as i32) * row_gap;
                let free = (ch - used).max(0);
                for r in 0..n_rows {
                    let Some(t) = eff_row_track(r) else { continue };
                    let f = track_fr(&t);
                    if f > 0.0 {
                        let share = round_f32_to_i32(free as f32 * f / fr_total);
                        // minmax の min_px 下限を保証。
                        let floor = match t {
                            GridTrack::MinMax { min_px, .. } => min_px,
                            _ => 0,
                        };
                        if let Some(rh) = row_heights.get_mut(r) {
                            *rh = share.max(floor);
                        }
                    }
                }
            }
        }

        // グリッドコンテナの `align-content`: 行トラック総高さがコンテナの明示
        // 高さより小さい場合に、トラック集合全体を交差軸（行軸）方向にどう配置
        // するか（`justify-content` の行版。コンテナに明示高さが無い場合は
        // 高さがトラック合計そのものになるため余剰は常に0で無関係）。
        let rows_total_h: i32 =
            row_heights.iter().sum::<i32>() + (n_rows.saturating_sub(1) as i32) * row_gap;
        let rows_free = container_h_explicit
            .map(|ch| (ch - rows_total_h).max(0))
            .unwrap_or(0);
        let align_content_grid = node
            .value("align-content")
            .unwrap_or_default()
            .trim()
            .to_lowercase();
        let (row_start_offset, row_extra_gap) = if rows_free > 0 && n_rows > 0 {
            match align_content_grid.as_str() {
                "end" | "flex-end" => (rows_free, 0),
                "center" => (rows_free / 2, 0),
                "space-between" if n_rows > 1 => (0, rows_free / (n_rows as i32 - 1)),
                "space-around" if n_rows > 0 => {
                    let g = rows_free / n_rows as i32;
                    (g / 2, g)
                }
                "space-evenly" if n_rows > 0 => {
                    let g = rows_free / (n_rows as i32 + 1);
                    (g, g)
                }
                _ => (0, 0),
            }
        } else {
            (0, 0)
        };
        let row_gap_eff = row_gap + row_extra_gap;

        // 各行 top の累積（row_gap_eff 込み）。
        let mut row_tops: Vec<i32> = alloc::vec![0; n_rows + 1];
        for r in 0..n_rows {
            let h = row_heights.get(r).copied().unwrap_or(0);
            row_tops[r + 1] = row_tops[r] + h + if r + 1 < n_rows { row_gap_eff } else { 0 };
        }

        // ---- パス3: 確定行 y で再レイアウト ----
        for (idx, child) in self.children.iter_mut().enumerate() {
            if Self::child_is_out_of_flow(child) {
                // out-of-flow（absolute/fixed）はセルを消費しない。サイズ確定のため
                // レイアウトのみ行い、最終位置は apply_positioned_offsets で確定する。
                let oof_cb = Dimensions {
                    content: Rect {
                        x: base_x,
                        y: base_y,
                        width: content_w,
                        height: 0,
                    },
                    ..Dimensions::default()
                };
                child.layout(oof_cb);
                continue;
            }
            let Some((r, c, rs, cs)) = placement[idx] else {
                continue;
            };
            let cell_w = grid_span_width(&col_widths, col_gap_eff, c, cs);
            let cell_x = base_x + col_start_offset + grid_col_x(&col_widths, col_gap_eff, c);
            let cell_y = base_y + row_start_offset + row_tops.get(r).copied().unwrap_or(0);
            // セル高さ = span 行の高さ合計（行間 gap 込み）。
            let mut cell_h = 0i32;
            for rr in r..(r + rs).min(row_heights.len()) {
                cell_h += row_heights.get(rr).copied().unwrap_or(0);
            }
            cell_h += (rs.saturating_sub(1) as i32) * row_gap;

            // アイテムの整列を解決（justify=列/インライン軸、align=行/ブロック軸）。
            let j = grid_item_align(child, "justify-self", &justify_items);
            let a = grid_item_align(child, "align-self", &align_items);

            // 列幅をコンテナ幅として測る。stretch（既定）は子がセル幅を埋める。
            let cell_cb = Dimensions {
                content: Rect {
                    x: cell_x,
                    y: cell_y,
                    width: cell_w,
                    height: 0,
                },
                ..Dimensions::default()
            };
            child.layout(cell_cb);

            // align:stretch かつ高さ未指定なら、セル高さへ伸ばす。
            if a == "stretch" && !box_has_explicit(child, "height") && cell_h > 0 {
                let mb = child.dimensions.margin_box();
                let non_content = mb.height - child.dimensions.content.height;
                child.dimensions.content.height = (cell_h - non_content).max(0);
            }

            // セル内整列（インライン軸=justify, ブロック軸=align）。
            // 幅方向の整列は、明示 width を持つ（=セル幅より狭い余地がある）アイテムにのみ
            // 適用する。width:auto のブロックはセル幅を埋めるため整列の余地が無く start 相当。
            let mb = child.dimensions.margin_box();
            let dx = if j == "stretch" || !box_has_explicit(child, "width") {
                0
            } else {
                let free = (cell_w - mb.width).max(0);
                match j {
                    "center" => free / 2,
                    "end" => free,
                    _ => 0, // start
                }
            };
            // 高さ方向の整列は、明示 height を持つアイテム（=セル高より低い余地がある）に適用。
            let dy = if a == "stretch" || !box_has_explicit(child, "height") {
                0
            } else {
                let free = (cell_h - mb.height).max(0);
                match a {
                    "center" => free / 2,
                    "end" => free,
                    _ => 0, // start
                }
            };
            if dx != 0 || dy != 0 {
                shift_layout_box(child, dx, dy);
            }
        }

        // コンテナ高さ。
        let natural_h = row_tops.get(n_rows).copied().unwrap_or(0).max(0);
        self.dimensions.content.height = container_h_explicit.unwrap_or(natural_h);

        // positioned 子要素の配置（grid コンテナを包含ブロック起点にできる）。
        let saved_abs_cb = self.establish_abs_cb();
        self.apply_positioned_offsets();
        Self::restore_abs_cb(saved_abs_cb);
    }

    fn layout_table(&mut self, containing_block: Dimensions) {
        self.apply_box_model_styles_with_base(containing_block.content.width);

        let h_non_content = self.dimensions.margin.left
            + self.dimensions.margin.right
            + self.dimensions.border.left
            + self.dimensions.border.right
            + self.dimensions.padding.left
            + self.dimensions.padding.right;
        let avail = (containing_block.content.width - h_non_content).max(1);

        // テーブル幅: width 指定があれば尊重、なければ利用幅
        let table_width = match &self.box_type {
            BoxType::TableNode(node) => match parse_length_value(node.value("width")) {
                Some(LengthValue::Px(px)) => px.max(1).min(avail),
                Some(LengthValue::Percent(pct)) => round_f32_to_i32(avail as f32 * pct).max(1),
                _ => avail,
            },
            _ => avail,
        };

        // 位置 (block と同じ規約)
        let flow_y = containing_block.content.y
            + containing_block.content.height
            + self.dimensions.margin.top;
        self.dimensions.content.x = containing_block.content.x
            + self.dimensions.margin.left
            + self.dimensions.border.left
            + self.dimensions.padding.left;
        self.dimensions.content.y =
            flow_y + self.dimensions.border.top + self.dimensions.padding.top;
        self.dimensions.content.width = table_width;

        let base_x = self.dimensions.content.x;

        // border-collapse: collapse 時は隣接セルの境界を 1px 重ねて二重線を解消する。
        let collapse = match &self.box_type {
            BoxType::TableNode(node) => node
                .value("border-collapse")
                .map(|v| v.trim().eq_ignore_ascii_case("collapse"))
                .unwrap_or(false),
            _ => false,
        };
        let collapse_px: i32 = if collapse { 1 } else { 0 };

        // table-layout: fixed 時は最初の行の各セルの明示 width のみで列幅を決定し、
        // 内容の計測（intrinsic_inline_size）を行わない（仕様通り、パフォーマンス目的の機能）。
        // 未指定の列は auto 列として残りの利用可能幅を均等に分け合う。
        let table_layout_fixed = match &self.box_type {
            BoxType::TableNode(node) => node
                .value("table-layout")
                .map(|v| v.trim().eq_ignore_ascii_case("fixed"))
                .unwrap_or(false),
            _ => false,
        };

        // border-spacing: セル間の隙間(px)。border-collapse:collapse では無効。
        // `10px`（水平・垂直共通）/ `10px 5px`（水平 垂直）の2形式に対応。
        let (h_spacing, v_spacing): (i32, i32) = if collapse {
            (0, 0)
        } else {
            match &self.box_type {
                BoxType::TableNode(node) => match node.value("border-spacing") {
                    Some(v) => {
                        let toks: Vec<&str> = v.split_whitespace().collect();
                        let px = |s: &str| -> i32 {
                            match parse_length_value(Some(String::from(s))) {
                                Some(LengthValue::Px(px)) => px.max(0),
                                _ => 0,
                            }
                        };
                        match toks.as_slice() {
                            [h] => (px(h), px(h)),
                            [h, w] => (px(h), px(w)),
                            _ => (0, 0),
                        }
                    }
                    None => (0, 0),
                },
                _ => (0, 0),
            }
        };

        // caption (<caption>) は既定でテーブル本体の上に積むが、`caption-side:bottom` なら
        // 本体の下へ配置する。後者は行の高さが確定してから配置する必要があるため、
        // 先頭 caption 自身の caption-side を見て分岐する。
        let caption_indices: Vec<usize> = (0..self.children.len())
            .filter(|&i| box_tag_name(&self.children[i]) == Some("caption"))
            .collect();
        let caption_side_bottom = caption_indices
            .first()
            .and_then(|&ci| box_style_value(&self.children[ci], "caption-side"))
            .map(|v| v.trim().eq_ignore_ascii_case("bottom"))
            .unwrap_or(false);
        let mut top_offset = 0i32;
        if !caption_side_bottom {
            let y = self.dimensions.content.y;
            top_offset = self.layout_captions_at(&caption_indices, base_x, y, table_width);
        }
        let rows_top = self.dimensions.content.y + top_offset;

        // 行 (tr) を抽出。セルは行の children。
        // `visibility:collapse` の行は display:none 相当に扱い、他の行を詰めて配置する
        // （実ブラウザは列幅の再計算まではしない簡略実装だが、行自体を除去する点は同じ）。
        let row_indices: Vec<usize> = (0..self.children.len())
            .filter(|&i| {
                matches!(self.children[i].box_type, BoxType::TableRowNode(_))
                    && box_style_value(&self.children[i], "visibility")
                        .map(|v| !v.trim().eq_ignore_ascii_case("collapse"))
                        .unwrap_or(true)
            })
            .collect();
        let nrows = row_indices.len();

        // --- グリッド構築: colspan/rowspan を解決して各セルの (列, 行, span) を確定 ---
        struct CellPlace {
            row_ord: usize,
            cell_ord: usize,
            col: usize,
            colspan: usize,
            rowspan: usize,
        }
        let mut occ: Vec<Vec<bool>> = Vec::new();
        let mut places: Vec<CellPlace> = Vec::new();
        let mut ncols = 0usize;
        for (row_ord, &ri) in row_indices.iter().enumerate() {
            let ncells = self.children[ri].children.len();
            let mut c = 0usize;
            for cell_ord in 0..ncells {
                // rowspan で先行行から占有されている列を読み飛ばす
                while occ_is(&occ, row_ord, c) {
                    c += 1;
                }
                let (cs, rs) = cell_spans(&self.children[ri].children[cell_ord]);
                let rs = rs.min(nrows - row_ord); // テーブル末尾を超える rowspan はクランプ
                for rr in row_ord..(row_ord + rs) {
                    for cc in c..(c + cs) {
                        occ_mark(&mut occ, rr, cc);
                    }
                }
                places.push(CellPlace {
                    row_ord,
                    cell_ord,
                    col: c,
                    colspan: cs,
                    rowspan: rs.max(1),
                });
                c += cs;
                ncols = ncols.max(c);
            }
        }

        if ncols == 0 {
            if caption_side_bottom {
                let y = self.dimensions.content.y + top_offset;
                top_offset += self.layout_captions_at(&caption_indices, base_x, y, table_width);
            }
            self.dimensions.content.height = top_offset;
            return;
        }

        // --- 列幅: まず colspan==1 のセルで基礎幅、次に colspan>1 の不足分を分配 ---
        let mut col_w = alloc::vec![0i32; ncols];
        let mut is_fixed_col = alloc::vec![false; ncols];
        let pad = 24; // 既定 padding 4px*2 + 余裕
        let usable_width = (table_width - h_spacing * (ncols as i32 - 1).max(0)).max(1);

        if table_layout_fixed {
            // table-layout:fixed: 最初の行（row_ord==0）の colspan==1 セルの明示 width のみで
            // 列幅を決定し、内容の計測は一切行わない（仕様通り、パフォーマンス目的の機能）。
            for p in &places {
                if p.row_ord != 0 || p.colspan != 1 {
                    continue;
                }
                let cell = &self.children[row_indices[p.row_ord]].children[p.cell_ord];
                if let Some(w) = box_style_value(cell, "width") {
                    match parse_length_value(Some(w)) {
                        Some(LengthValue::Px(px)) => {
                            col_w[p.col] = px.max(1);
                            is_fixed_col[p.col] = true;
                        }
                        Some(LengthValue::Percent(pct)) => {
                            col_w[p.col] = round_f32_to_i32(usable_width as f32 * pct).max(1);
                            is_fixed_col[p.col] = true;
                        }
                        _ => {}
                    }
                }
            }
            // auto 列（明示 width の無い列）は、固定列を除いた残り幅を均等に分け合う。
            let fixed_sum: i32 = (0..ncols).filter(|&c| is_fixed_col[c]).map(|c| col_w[c]).sum();
            let auto_cols: alloc::vec::Vec<usize> =
                (0..ncols).filter(|&c| !is_fixed_col[c]).collect();
            if !auto_cols.is_empty() {
                let remaining = (usable_width - fixed_sum).max(0);
                let auto_w = (remaining / auto_cols.len() as i32).max(1);
                for &c in &auto_cols {
                    col_w[c] = auto_w;
                }
            }
        } else {
            for p in &places {
                if p.colspan != 1 {
                    continue;
                }
                let (cw, _) = self.children[row_indices[p.row_ord]].children[p.cell_ord]
                    .intrinsic_inline_size(table_width);
                col_w[p.col] = col_w[p.col].max(cw + pad);
            }
            for p in &places {
                if p.colspan <= 1 {
                    continue;
                }
                let (cw, _) = self.children[row_indices[p.row_ord]].children[p.cell_ord]
                    .intrinsic_inline_size(table_width);
                let need = cw + pad;
                let cur: i32 = col_w[p.col..p.col + p.colspan].iter().sum();
                if need > cur {
                    let deficit = need - cur;
                    let add = deficit / p.colspan as i32;
                    for cc in p.col..p.col + p.colspan {
                        col_w[cc] += add;
                    }
                    col_w[p.col] += deficit - add * p.colspan as i32; // 端数は先頭列へ
                }
            }

            // 総和を利用可能幅に合わせる (超過→比例縮小 / 不足→均等加算)。
            // table-layout:fixed では列幅は明示値で確定しているため、この正規化は auto モードのみ。
            let total: i32 = col_w.iter().sum::<i32>().max(1);
            if total > usable_width {
                for w in col_w.iter_mut() {
                    *w = ((*w as i64 * usable_width as i64) / total as i64).max(1) as i32;
                }
            } else {
                let extra = (usable_width - total) / ncols as i32;
                for w in col_w.iter_mut() {
                    *w += extra;
                }
            }
        }
        // 列開始 x オフセット（列間に border-spacing を挿入）
        let mut col_x = alloc::vec![0i32; ncols];
        let mut acc = 0i32;
        for c in 0..ncols {
            col_x[c] = acc;
            acc += col_w[c];
            if c + 1 < ncols {
                acc += h_spacing;
            }
        }
        let span_w = |col: usize, colspan: usize| -> i32 {
            col_w[col..(col + colspan).min(ncols)].iter().sum::<i32>()
                + h_spacing * colspan.saturating_sub(1) as i32
        };

        // --- 高さ計測パス: 各セルを確定列幅でレイアウトして外形高さを得る ---
        let mut place_h = alloc::vec![0i32; places.len()];
        for (pi, p) in places.iter().enumerate() {
            let cw_total = span_w(p.col, p.colspan);
            let cell = &mut self.children[row_indices[p.row_ord]].children[p.cell_ord];
            let mut cb = Dimensions::default();
            cb.content.x = base_x + col_x[p.col];
            cb.content.y = rows_top;
            cb.content.height = 0;
            cb.content.width = cw_total;
            cell.layout(cb);
            place_h[pi] = cell.dimensions.margin_box().height;
        }
        // 行高さ: rowspan==1 で確定、rowspan>1 は不足分を最終行へ加算
        let mut row_h = alloc::vec![0i32; nrows];
        for (pi, p) in places.iter().enumerate() {
            if p.rowspan == 1 {
                row_h[p.row_ord] = row_h[p.row_ord].max(place_h[pi]);
            }
        }
        for (pi, p) in places.iter().enumerate() {
            if p.rowspan <= 1 {
                continue;
            }
            let end = (p.row_ord + p.rowspan).min(nrows);
            let cur: i32 = row_h[p.row_ord..end].iter().sum();
            if place_h[pi] > cur {
                row_h[end - 1] += place_h[pi] - cur;
            }
        }
        // 行 y 先頭オフセット (テーブル本体内の相対、行間に border-spacing を挿入)
        let mut row_y = alloc::vec![0i32; nrows];
        let mut accy = 0i32;
        for r in 0..nrows {
            row_y[r] = accy;
            accy += row_h[r];
            if r + 1 < nrows {
                accy += v_spacing;
            }
        }
        let rows_total = accy;

        // --- 確定パス: 各セルを最終位置で再レイアウトし、列幅・スパン行高さに合わせる ---
        for p in places.iter() {
            let cw_total = span_w(p.col, p.colspan);
            let end_r = (p.row_ord + p.rowspan).min(nrows);
            let span_h: i32 = row_h[p.row_ord..end_r].iter().sum();
            let x0 = base_x + col_x[p.col] - collapse_px * p.col as i32;
            let y0 = rows_top + row_y[p.row_ord] - collapse_px * p.row_ord as i32;
            let cell = &mut self.children[row_indices[p.row_ord]].children[p.cell_ord];
            let mut cb = Dimensions::default();
            cb.content.x = x0;
            cb.content.y = y0;
            cb.content.height = 0;
            cb.content.width = cw_total;
            cell.layout(cb); // 子要素を最終位置で配置し直す
            let w_extra = cell.dimensions.padding.left
                + cell.dimensions.padding.right
                + cell.dimensions.border.left
                + cell.dimensions.border.right;
            let h_extra = cell.dimensions.padding.top
                + cell.dimensions.padding.bottom
                + cell.dimensions.border.top
                + cell.dimensions.border.bottom;
            // vertical-align: middle/bottom — 行がセルの自然な高さより高い場合、
            // 余った縦方向の空間分だけ子孫全体を下へ平行移動する（既定/top/baseline は無移動）。
            let natural_h = cell.dimensions.content.height;
            let target_h = (span_h - h_extra).max(natural_h);
            let extra_space = (target_h - natural_h).max(0);
            if extra_space > 0 {
                let va = match &cell.box_type {
                    BoxType::TableCellNode(node) => node.value("vertical-align").unwrap_or_default(),
                    _ => String::new(),
                };
                let dy = match va.trim() {
                    "middle" | "center" => extra_space / 2,
                    "bottom" => extra_space,
                    _ => 0, // top / baseline(簡略化) / 未指定
                };
                // セル自身の box（背景・境界）は行の先頭に留め、中身（子要素）だけを下げる。
                for child in &mut cell.children {
                    child.translate_y(dy);
                }
            }
            cell.dimensions.content.width = (cw_total - w_extra).max(1);
            cell.dimensions.content.height = target_h;
        }

        // 行ボックスの寸法を設定 (背景・境界の整列用)
        for (row_ord, &ri) in row_indices.iter().enumerate() {
            let row = &mut self.children[ri];
            row.dimensions.content.x = base_x;
            row.dimensions.content.y = rows_top + row_y[row_ord] - collapse_px * row_ord as i32;
            row.dimensions.content.width = table_width;
            row.dimensions.content.height = row_h[row_ord];
            // セル（行の直下子）の relative/absolute/fixed オフセット + transform を適用。
            // 行を包含ブロックとして共有後処理を流用する。
            let saved_row_cb = row.establish_abs_cb();
            row.apply_positioned_offsets();
            Self::restore_abs_cb(saved_row_cb);
        }

        // collapse 時は重ね合わせぶん全体が縮む
        let collapse_shrink = collapse_px * (nrows.saturating_sub(1)) as i32;
        let rows_height = (rows_total - collapse_shrink).max(0);
        if caption_side_bottom {
            let y = self.dimensions.content.y + top_offset + rows_height;
            top_offset += self.layout_captions_at(&caption_indices, base_x, y, table_width);
        }
        self.dimensions.content.height = top_offset + rows_height;

        // positioned 直下子要素の配置（table を包含ブロック起点にできる）。
        // 通常フローのセル/行はすでに配置済み。relative オフセットや、table が
        // positioned のときの子孫 absolute 解決のため共有後処理を適用する。
        let saved_abs_cb = self.establish_abs_cb();
        self.apply_positioned_offsets();
        Self::restore_abs_cb(saved_abs_cb);
    }

    fn layout_flex(&mut self, containing_block: Dimensions) {
        self.apply_box_model_styles_with_base(containing_block.content.width);

        let (width_val, min_width_val, max_width_val, height_val, box_sizing, h_auto) =
            match &self.box_type {
                BoxType::FlexNode(node) => (
                    node.value("width"),
                    node.value("min-width"),
                    node.value("max-width"),
                    node.value("height"),
                    node.value("box-sizing").unwrap_or_default(),
                    margin_is_h_auto(node),
                ),
                _ => return,
            };
        // padding + border のみ（box-sizing:border-box / margin:auto センタリング用）。
        let inner_non_content = self.dimensions.border.left
            + self.dimensions.border.right
            + self.dimensions.padding.left
            + self.dimensions.padding.right;

        let horizontal_non_content = self.dimensions.margin.left
            + self.dimensions.margin.right
            + self.dimensions.border.left
            + self.dimensions.border.right
            + self.dimensions.padding.left
            + self.dimensions.padding.right;
        let available_width = containing_block.content.width.max(1);
        let explicit_width =
            !matches!(parse_length_value(width_val.clone()), Some(LengthValue::Auto) | None);

        let mut content_width = match parse_length_value(width_val) {
            Some(LengthValue::Auto) | None => (available_width - horizontal_non_content).max(1),
            Some(LengthValue::Px(px)) => px.max(1),
            Some(LengthValue::Percent(pct)) => {
                round_f32_to_i32(available_width as f32 * pct).max(1)
            }
            Some(LengthValue::MinContent) => {
                let (minc, _maxc) = self.block_intrinsic_widths();
                minc.max(1)
            }
            Some(LengthValue::MaxContent) => {
                let (_minc, maxc) = self.block_intrinsic_widths();
                maxc.max(1)
            }
            Some(LengthValue::FitContent) => {
                let (minc, maxc) = self.block_intrinsic_widths();
                let avail = (available_width - horizontal_non_content).max(0);
                avail.min(maxc).max(minc).max(1)
            }
            Some(LengthValue::MathExpr(expr)) => {
                crate::os_lib::css::eval_css_math(&expr, available_width)
                    .unwrap_or((available_width - horizontal_non_content).max(1))
                    .max(1)
            }
        };
        // box-sizing: border-box → 指定 width は border-box 全体（layout_block と同じ）。
        if explicit_width && box_sizing.trim() == "border-box" {
            content_width = (content_width - inner_non_content).max(1);
        }

        if let Some(min_width) =
            parse_length_value(min_width_val).and_then(|v| resolve_length_value(v, available_width))
        {
            content_width = content_width.max(min_width);
        }
        if let Some(max_width) =
            parse_length_value(max_width_val).and_then(|v| resolve_length_value(v, available_width))
        {
            content_width = content_width.min(max_width);
        }
        self.dimensions.content.width = content_width.max(1);

        // margin: auto（左右）→ 水平センタリング（layout_block と同じ。
        // 実サイトの `.container{max-width:..;margin:0 auto}` + `display:flex` がこれ）。
        if h_auto {
            let free = (available_width - self.dimensions.content.width - inner_non_content).max(0);
            self.dimensions.margin.left = free / 2;
            self.dimensions.margin.right = free / 2;
        }

        let flow_y = containing_block.content.y
            + containing_block.content.height
            + self.dimensions.margin.top;
        self.dimensions.content.x = containing_block.content.x
            + self.dimensions.margin.left
            + self.dimensions.border.left
            + self.dimensions.padding.left;
        self.dimensions.content.y =
            flow_y + self.dimensions.border.top + self.dimensions.padding.top;

        // 子の `height:%` の基準（明示 px 高さのみ。border-box なら content 高へ換算）。
        let definite_h = self.explicit_content_height_px(height_val.clone()).unwrap_or(-1);
        let _pct_h_guard = PctBaseHGuard::set(definite_h);

        let (flex_dir, justify_content, align_items, align_content, row_gap, col_gap, flex_wrap) =
            match &self.box_type {
                BoxType::FlexNode(node) => {
                    let (rg, cg) = parse_flex_gap(node, self.dimensions.content.width);
                    (
                        node.value("flex-direction")
                            .unwrap_or_else(|| String::from("row"))
                            .trim()
                            .to_lowercase(),
                        node.value("justify-content")
                            .unwrap_or_else(|| String::from("flex-start"))
                            .trim()
                            .to_lowercase(),
                        node.value("align-items")
                            .unwrap_or_else(|| String::from("stretch"))
                            .trim()
                            .to_lowercase(),
                        node.value("align-content")
                            .unwrap_or_else(|| String::from("stretch"))
                            .trim()
                            .to_lowercase(),
                        rg,
                        cg,
                        node.value("flex-wrap")
                            .unwrap_or_else(|| String::from("nowrap"))
                            .trim()
                            .to_lowercase(),
                    )
                }
                _ => return,
            };

        // row / row-reverse は主軸が水平。column / column-reverse は垂直。
        let is_row = flex_dir == "row" || flex_dir == "row-reverse";
        let is_reverse = flex_dir == "row-reverse" || flex_dir == "column-reverse";
        // flex-wrap: wrap / wrap-reverse のとき複数行へ折り返す。
        let do_wrap = flex_wrap == "wrap" || flex_wrap == "wrap-reverse";
        // 主軸方向の gap（row なら列間=column-gap、column なら行間=row-gap）。
        let gap_main = if is_row { col_gap } else { row_gap };
        // 交差軸方向の gap（行間）。
        let gap_cross = if is_row { row_gap } else { col_gap };

        if do_wrap {
            self.layout_flex_wrapped(
                is_row,
                is_reverse,
                flex_wrap == "wrap-reverse",
                &justify_content,
                &align_items,
                &align_content,
                gap_main,
                gap_cross,
                height_val.clone(),
            );
            return;
        }

        // Layout all children as if they were inline-blocks (or blocks) with 0 initial x/y to measure them
        let mut total_main = 0;
        let mut max_cross = 0;
        // out-of-flow（absolute/fixed）はフレックスラインに参加しない。サイズ確定のため
        // レイアウトはするが、主軸合計・交差軸最大・justify の item 数には数えない。
        let oof: Vec<bool> = self
            .children
            .iter()
            .map(|c| Self::child_is_out_of_flow(c))
            .collect();
        let n = oof.iter().filter(|&&b| !b).count();

        // flex-basis の % 解決基準（コンテナ主軸長）。row は content 幅、column は明示高さ。
        let basis_main_ref = if is_row {
            self.dimensions.content.width
        } else {
            match parse_length_value(height_val.clone()) {
                Some(LengthValue::Px(px)) => px,
                _ => 0,
            }
        };

        for (ci, child) in self.children.iter_mut().enumerate() {
            let mut cb = self.dimensions.clone();
            cb.content.x = 0;
            cb.content.y = 0;
            cb.content.height = 0; // unlimited
            child.layout(cb);
            if oof.get(ci).copied().unwrap_or(false) {
                continue;
            }
            // flex アイテムの主軸 auto margin は flex 側で処理する。layout_block が
            // margin:auto を「ブロック水平センタリング」として margin.left/right の両方へ
            // free/2 を入れてしまうため、主軸 auto margin がある辺方向の両端 margin を
            // 0 へ戻す（margin_box を実サイズに戻し、flex の auto 分配へ委ねる）。
            {
                let (lead, trail) = box_main_auto_margins(child, is_row);
                if lead || trail {
                    if is_row {
                        child.dimensions.margin.left = 0;
                        child.dimensions.margin.right = 0;
                    } else {
                        child.dimensions.margin.top = 0;
                        child.dimensions.margin.bottom = 0;
                    }
                }
            }
            // flex-basis 指定があれば主軸 content サイズを basis へ上書き（grow/shrink の基準）。
            if let Some(basis) = box_flex_basis(child, basis_main_ref) {
                if is_row {
                    child.dimensions.content.width = basis;
                } else {
                    child.dimensions.content.height = basis;
                }
            }
            // 【2026-09-04】幅指定が無い flex アイテムの基準幅は、
            // **自身の max-content 幅**（CSS Flexbox L1 §9.2「flex base size」）。
            //
            // 従来は「幅 auto のブロックとしてレイアウトした結果」＝
            // 親いっぱいの幅をそのまま基準にしていた。その結果どの項目も
            // 基準が同じ値になり、縮小が**均等割り**になっていた。
            // 実サイト（www.sugi-lab.net）のナビ 8 項目が全部 88px に
            // 揃えられ、幅の合計が描画幅を超えてはみ出していた
            // （実測: container=924 なのに item0..7 すべて base=924）。
            // 正しくは項目ごとに基準が違うので、比例配分で
            // 短い項目は短いまま、長い項目が多く縮む。
            if is_row
                && box_flex_basis(child, basis_main_ref).is_none()
                && !box_has_explicit(child, "width")
            {
                let mut max_content = child.block_intrinsic_widths().1;
                // 【2026-09-26】基準サイズは min/max-width で挟む（§9.2 の
                // hypothetical main size）。`img{max-width:100%}` が自然幅のまま
                // 親をはみ出していた（実サイトのプロジェクト紹介画像）。
                let container_w = self.dimensions.content.width;
                if let Some(mw) = box_len(child, "max-width", container_w) {
                    max_content = max_content.min(mw.max(0));
                }
                if let Some(mw) = box_len(child, "min-width", container_w) {
                    max_content = max_content.max(mw);
                }
                if max_content > 0 && max_content != child.dimensions.content.width {
                    // 幅を変えたら、その幅でレイアウトをやり直す。
                    // 子は親いっぱいの幅で組まれているので、幅だけ
                    // 書き換えると中身が古い位置に取り残される
                    // （ナビが本来より右へずれて出た）。縮小側と同じ手当て。
                    let mut cb2 = self.dimensions.clone();
                    cb2.content.x = 0;
                    cb2.content.y = 0;
                    // 【2026-09-26 バグ修正】包含幅は content 幅 + 横の margin/border/padding。
                    // content 幅だけを渡すと layout が padding 等をもう一度引き、中身が
                    // その分だけ狭く組まれていた（ヒーロー見出しが 40px 狭くはみ出した）。
                    cb2.content.width = max_content + child.h_non_content();
                    cb2.content.height = 0; // unlimited
                    child.layout(cb2);
                    child.dimensions.content.width = max_content;
                }
            }
            let child_w = child.dimensions.margin_box().width;
            let child_h = child.dimensions.margin_box().height;
            if is_row {
                total_main += child_w;
                max_cross = max_cross.max(child_h);
            } else {
                total_main += child_h;
                max_cross = max_cross.max(child_w);
            }
        }
        // アイテム間の gap を主軸合計に加える（n-1 箇所）。
        if n > 1 {
            total_main += gap_main * (n as i32 - 1);
        }

        let container_main = if is_row {
            self.dimensions.content.width
        } else {
            self.explicit_content_height_px(height_val.clone()).unwrap_or(total_main)
        };

        let mut container_cross = if is_row {
            self.explicit_content_height_px(height_val.clone()).unwrap_or(max_cross)
        } else {
            self.dimensions.content.width
        };

        if !is_row {
            self.dimensions.content.height = container_main;
        } else {
            self.dimensions.content.height = container_cross;
        }

        // flex-grow / flex:N: grower を flex-basis 0 扱いにし、主軸の残余空間を grow 比で分配。
        // grower が無ければ何もしない（従来挙動を完全維持）。
        let grows: Vec<i32> = self
            .children
            .iter()
            .enumerate()
            .map(|(i, c)| {
                if oof.get(i).copied().unwrap_or(false) {
                    0
                } else {
                    box_flex_grow(c)
                }
            })
            .collect();
        let total_grow: i32 = grows.iter().sum();
        if total_grow > 0 {
            // grower の主軸 content を 0 とみなした基準長（非content分=padding/border/margin は残す）。
            let mut base_main = total_main;
            for (i, child) in self.children.iter().enumerate() {
                if grows.get(i).copied().unwrap_or(0) <= 0 {
                    continue;
                }
                base_main -= if is_row {
                    child.dimensions.content.width
                } else {
                    child.dimensions.content.height
                };
            }
            let free = (container_main - base_main).max(0);
            if free > 0 {
                let last_grow_idx = grows.iter().rposition(|g| *g > 0);
                let mut remaining = free;
                for (i, child) in self.children.iter_mut().enumerate() {
                    let g = grows.get(i).copied().unwrap_or(0);
                    if g <= 0 {
                        continue;
                    }
                    // 端数は最後の grower に寄せて合計を厳密一致させる。
                    let extra = if Some(i) == last_grow_idx {
                        remaining
                    } else {
                        free * g / total_grow
                    };
                    remaining -= extra;
                    if is_row {
                        child.dimensions.content.width = extra.max(0);
                    } else {
                        child.dimensions.content.height = extra.max(0);
                    }
                }
                total_main = base_main + free; // = container_main（justify 余白 0）
            }
        }

        // flex-shrink: 主軸がコンテナを超過する場合、shrink 係数に比例して各アイテムを縮める。
        // grower がいた（既に container にフィット）場合はスキップ。CSS では基準サイズで
        // 重み付けするが、ここでは簡易に shrink 係数のみで余剰超過分を按分する。
        let overflow = total_main - container_main;
        if total_grow == 0 && overflow > 0 {
            let shrinks: Vec<i32> = self
                .children
                .iter()
                .enumerate()
                .map(|(i, c)| {
                    if oof.get(i).copied().unwrap_or(false) {
                        0
                    } else {
                        box_flex_shrink(c)
                    }
                })
                .collect();
            let total_shrink: i32 = shrinks.iter().sum();
            if total_shrink > 0 {
                // 【2026-07-28 規格対応】従来は `.max(0)` で 0 までしか止めておらず、
                // **自動最小サイズ（min-width:auto）を一切見ていなかった**。その結果
                // `.hero-content` が 240px まで縮み、14 文字の見出しが 3 行に
                // 過剰折り返しされてサブテキストと重なっていた。
                // 仕様・不変条件は `spec/flex_min_size.md`（CSS Flexbox L1 §4.5/§9.7）。
                let items: Vec<crate::os_lib::layout::flex_min::ShrinkItem> = self
                    .children
                    .iter()
                    .enumerate()
                    .map(|(i, c)| {
                        let base = if is_row {
                            c.dimensions.content.width
                        } else {
                            c.dimensions.content.height
                        };
                        // 自動最小サイズは min-content（分割できない最長語）で代用する近似。
                        let min = if is_row {
                            c.block_intrinsic_widths().0
                        } else {
                            0
                        };
                        crate::os_lib::layout::flex_min::ShrinkItem {
                            base: base.max(0),
                            min: min.clamp(0, base.max(0)),
                            shrink: shrinks.get(i).copied().unwrap_or(0).max(0),
                        }
                    })
                    .collect();

                match crate::os_lib::layout::flex_min::distribute_shrink(&items, overflow.max(0)) {
                    Ok(sizes) => {
                        for (i, child) in self.children.iter_mut().enumerate() {
                            if let Some(&s) = sizes.get(i) {
                                if is_row {
                                    child.dimensions.content.width = s;
                                } else {
                                    child.dimensions.content.height = s;
                                }
                            }
                        }
                        // 【2026-09-04】縮めた子は、その幅でレイアウトをやり直す。
                        //
                        // 幅だけ書き換えても、テキストは**元の広い幅で組まれたまま**
                        // なので折り返さず、高さも更新されない。実サイト
                        // （www.sugi-lab.net）のヘッダで、本来 2 行に折り返して
                        // 収まるロゴとナビ項目が 1 行のままになり、ナビ 8 項目の
                        // うち 4 項目が画面外へ押し出されていた。
                        //
                        // 主軸が横のときだけでよい。縦のときに縮むのは高さで、
                        // 高さを変えても行の折り返しは変わらない。
                        if is_row {
                            for (i, child) in self.children.iter_mut().enumerate() {
                                if oof.get(i).copied().unwrap_or(false) {
                                    continue;
                                }
                                let Some(&s) = sizes.get(i) else {
                                    continue;
                                };
                                let base = items.get(i).map(|it| it.base).unwrap_or(s);
                                // 縮んでいない子はやり直さない（無駄な再計算を避ける）。
                                if s >= base {
                                    continue;
                                }
                                let mut cb = self.dimensions.clone();
                                cb.content.x = 0;
                                cb.content.y = 0;
                                // 基準サイズの組み直しと同じく、横の非 content 分を足して渡す
                                // （2026-09-26 まで padding 等が二重に引かれていた）。
                                cb.content.width = s + child.h_non_content();
                                cb.content.height = 0; // unlimited
                                child.layout(cb);
                                // やり直しで幅が戻ることがあるので、縮小後の値を残す。
                                child.dimensions.content.width = s;
                            }
                        }
                        // 下限で吸収しきれない場合ははみ出すのが正しい（F-4）ので、
                        // container_main に丸めず実際の合計を使う。
                        total_main = sizes.iter().sum::<i32>().max(container_main.min(total_main));
                    }
                    Err(_) => {
                        // 引数不正。エラーは flex_min 側でログ済み。
                        // 安全側＝縮小を行わない（はみ出す方がレイアウト崩壊より軽い）。
                    }
                }
            }
        }

        // 【2026-09-05】縮小で子を組み直したら、**親の高さも計算し直す**。
        //
        // 交差軸のサイズ（横並びなら高さ）は縮小より前に確定していた。
        // 縮小した子はその幅で組み直すので行数が増えることがあり、
        // 高さが 1 行ぶんのまま取り残されて**次の要素と重なる**。
        // 実サイト `forms.htm` の目次で、2 行に折り返した項目が
        // 次の項目に重なって出ていた。
        //
        // 高さが明示されている場合は指定を尊重する（伸ばさない）。
        if is_row && !matches!(parse_length_value(height_val.clone()), Some(LengthValue::Px(_))) {
            let mut recomputed = 0;
            for (ci, child) in self.children.iter().enumerate() {
                if oof.get(ci).copied().unwrap_or(false) {
                    continue;
                }
                recomputed = recomputed.max(child.dimensions.margin_box().height);
            }
            if recomputed > container_cross {
                container_cross = recomputed;
                self.dimensions.content.height = container_cross;
            }
        }

        // align-items: stretch（既定値）: 交差軸サイズ未指定の子をコンテナ交差幅へ伸ばす。
        // ただし align-self が明示された子は除外（個別指定を尊重）。
        if align_items == "stretch" {
            let cross_prop = if is_row { "height" } else { "width" };
            for (ci, child) in self.children.iter_mut().enumerate() {
                if oof.get(ci).copied().unwrap_or(false) {
                    continue;
                }
                if box_has_explicit(child, cross_prop) {
                    continue;
                }
                // align-self が stretch 以外で指定されていれば stretch しない。
                if let Some(s) = box_align_self(child) {
                    if s != "stretch" {
                        continue;
                    }
                }
                let mb = child.dimensions.margin_box();
                let (cur_cross, cur_content) = if is_row {
                    (mb.height, child.dimensions.content.height)
                } else {
                    (mb.width, child.dimensions.content.width)
                };
                let non_content = cur_cross - cur_content; // padding/border/margin 分
                let new_content = (container_cross - non_content).max(0);
                if is_row {
                    child.dimensions.content.height = new_content;
                } else {
                    child.dimensions.content.width = new_content;
                }
            }
        }

        // Justify Content (Main Axis)
        let main_free_space = container_main - total_main;

        // flex 主軸 auto margin: 主軸方向に auto margin を持つアイテムがあれば、
        // 余剰空間を全 auto margin 辺で均等分配する（justify-content より優先）。
        let mut total_auto_margins = 0i32;
        for (ci, child) in self.children.iter().enumerate() {
            if oof.get(ci).copied().unwrap_or(false) {
                continue;
            }
            let (a, b) = box_main_auto_margins(child, is_row);
            total_auto_margins += a as i32 + b as i32;
        }
        let auto_margin_unit = if total_auto_margins > 0 && main_free_space > 0 {
            main_free_space / total_auto_margins
        } else {
            0
        };
        let use_auto_margins = total_auto_margins > 0 && main_free_space > 0;

        let main_offset = if use_auto_margins {
            0
        } else {
            match justify_content.as_str() {
                // CSS Box Alignment Level 3 の汎用キーワード `end` は `flex-end` の別名
                // （`align-content` は既に対応済みだったが、主軸側のここは漏れており
                // `justify-content: end` が `flex-start` と同じ挙動に落ちる静かなバグ
                // だった）。
                "flex-end" | "end" => main_free_space,
                "center" => main_free_space / 2,
                "space-around" if n > 0 => main_free_space / (n as i32 * 2),
                // `space-evenly` はアイテム間だけでなく先頭/末尾の余白も均等にする
                // （align-content の space-evenly と同じ `free / (n+1)` の式）。
                // 以前はこの分岐が無く flex-start と同じ挙動に落ちる静かなバグだった。
                "space-evenly" if n > 0 => main_free_space / (n as i32 + 1),
                // flex-start / start / space-between（ループで処理）/ space-around・space-evenly(n==0)
                _ => 0,
            }
        };

        let spacing = if use_auto_margins {
            0
        } else {
            match justify_content.as_str() {
                "space-between" if n > 1 => main_free_space / (n as i32 - 1),
                "space-around" if n > 0 => main_free_space / (n as i32),
                "space-evenly" if n > 0 => main_free_space / (n as i32 + 1),
                _ => 0,
            }
        };

        // 主軸の配置。reverse なら主軸終端（row なら右端）から DOM 順に詰める。
        // cursor は「正方向なら先頭からの距離 / reverse なら終端からの距離」。
        // order: アイテムを order 昇順（同値は DOM 順）に並べ替えて配置する。
        let mut order_idx: Vec<usize> = (0..self.children.len()).collect();
        order_idx.sort_by_key(|&i| (box_order(&self.children[i]), i));
        let mut cursor = main_offset;
        for &ci in &order_idx {
            // out-of-flow はフロー配置をスキップ（cursor を進めない）。後段で配置する。
            if oof.get(ci).copied().unwrap_or(false) {
                continue;
            }
            // 主軸 auto margin: 先頭辺ぶんを cursor へ加算（アイテムを後方へ押す）。
            let (lead_auto, trail_auto) = if use_auto_margins {
                box_main_auto_margins(&self.children[ci], is_row)
            } else {
                (false, false)
            };
            if lead_auto {
                cursor += auto_margin_unit;
            }
            let child_w = self.children[ci].dimensions.margin_box().width;
            let child_h = self.children[ci].dimensions.margin_box().height;
            let child_main = if is_row { child_w } else { child_h };

            let cross_free_space = container_cross - if is_row { child_h } else { child_w };
            // align-self が指定されていればそれを優先、無ければ align-items。
            let effective_align =
                box_align_self(&self.children[ci]).unwrap_or_else(|| align_items.clone());
            let cross_offset = match effective_align.as_str() {
                // `end`/`self-end` は `flex-end` の別名（CSS Box Alignment Level 3）。
                // 以前はここで漏れており `align-items: end` が `flex-start` と
                // 同じ挙動に落ちる静かなバグだった。
                "flex-end" | "end" | "self-end" => cross_free_space,
                "center" => cross_free_space / 2,
                _ => 0, // flex-start / start / stretch
            };

            // 主軸開始位置（コンテナ content 原点からの相対）。reverse は終端から逆算。
            let main_start = if is_reverse {
                container_main - cursor - child_main
            } else {
                cursor
            };

            // Recursively update positions relative to container
            let start_x = self.dimensions.content.x;
            let start_y = self.dimensions.content.y;

            let target_x = if is_row {
                start_x + main_start
            } else {
                start_x + cross_offset
            };
            let target_y = if is_row {
                start_y + cross_offset
            } else {
                start_y + main_start
            };

            let shift_x = target_x - self.children[ci].dimensions.margin_box().x;
            let shift_y = target_y - self.children[ci].dimensions.margin_box().y;

            shift_layout_box(&mut self.children[ci], shift_x, shift_y);

            cursor += child_main + spacing + gap_main;
            if trail_auto {
                cursor += auto_margin_unit;
            }
        }

        // positioned 子要素の配置（flex コンテナを包含ブロック起点にできる）。
        // フロー内アイテムは上で配置済み。out-of-flow とフロー内 relative の両方を処理する。
        let saved_abs_cb = self.establish_abs_cb();
        self.apply_positioned_offsets();
        Self::restore_abs_cb(saved_abs_cb);
    }

    /// flex-wrap: wrap / wrap-reverse のレイアウト。
    /// 子を主軸に沿って並べ、コンテナ主軸長を超えたら次の行へ折り返す。
    /// 各行ごとに justify-content（主軸）と align-items / align-self（交差軸）を適用する。
    #[allow(clippy::too_many_arguments)]
    fn layout_flex_wrapped(
        &mut self,
        is_row: bool,
        is_reverse: bool,
        wrap_reverse: bool,
        justify_content: &str,
        align_items: &str,
        align_content: &str,
        gap_main: i32,
        gap_cross: i32,
        height_val: Option<String>,
    ) {
        let n = self.children.len();
        if n == 0 {
            return;
        }

        // 各子を測定（main/cross サイズ）。out-of-flow（absolute/fixed）は
        // フレックスラインに参加しないため flow_idx から除外する（サイズ確定のため
        // layout は行う）。最終配置は末尾の apply_positioned_offsets が行う。
        let oof: Vec<bool> = self
            .children
            .iter()
            .map(|c| Self::child_is_out_of_flow(c))
            .collect();
        let mut sizes: Vec<(i32, i32)> = Vec::with_capacity(n); // (main, cross)
        for child in &mut self.children {
            let mut cb = self.dimensions.clone();
            cb.content.x = 0;
            cb.content.y = 0;
            cb.content.height = 0;
            child.layout(cb);
            let w = child.dimensions.margin_box().width;
            let h = child.dimensions.margin_box().height;
            if is_row {
                sizes.push((w, h));
            } else {
                sizes.push((h, w));
            }
        }
        // フロー参加インデックス（DOM 順）。以降のライン分割・配置はこの並びで行う。
        let flow_idx: Vec<usize> = (0..n).filter(|&i| !oof[i]).collect();

        let container_main = if is_row {
            self.dimensions.content.width
        } else {
            // column 方向で高さ未指定なら折り返さない（実質1行）
            self.explicit_content_height_px(height_val.clone()).unwrap_or(i32::MAX / 4)
        };

        // 行分割: 主軸長がコンテナを超えたら改行。インデックスは flow_idx の位置（pos）。
        let fln = flow_idx.len();
        let mut lines: Vec<(usize, usize, i32, i32)> = Vec::new(); // (start_pos, end_pos_excl, main_used, cross_max)
        let mut line_start = 0usize;
        let mut line_main = 0i32;
        let mut line_cross = 0i32;
        for pos in 0..fln {
            let (m, c) = sizes[flow_idx[pos]];
            let add = if pos == line_start { m } else { m + gap_main };
            if pos > line_start && line_main + add > container_main {
                lines.push((line_start, pos, line_main, line_cross));
                line_start = pos;
                line_main = m;
                line_cross = c;
            } else {
                line_main += add;
                line_cross = line_cross.max(c);
            }
        }
        lines.push((line_start, fln, line_main, line_cross));

        // 行を wrap-reverse なら逆順に積む。
        if wrap_reverse {
            lines.reverse();
        }

        // コンテナ交差軸長を確定。
        let total_cross: i32 =
            lines.iter().map(|l| l.3).sum::<i32>() + gap_cross * (lines.len() as i32 - 1).max(0);
        let container_cross = if is_row {
            self.explicit_content_height_px(height_val.clone()).unwrap_or(total_cross)
        } else {
            self.dimensions.content.width
        };

        if is_row {
            self.dimensions.content.height = container_cross.max(total_cross);
        } else {
            self.dimensions.content.height = container_main.min(total_cross).max(total_cross);
        }

        let base_x = self.dimensions.content.x;
        let base_y = self.dimensions.content.y;

        // align-content: 複数行ブロックを交差軸方向にどう配置するか。
        // 余剰交差空間 = container_cross - total_cross（行の自然交差合計）。
        // line_cross_start[i] = 各行の交差軸開始位置、line_cross_size[i] = 各行の交差軸高さ
        // （stretch では余剰を均等に各行へ加算）。
        let nlines = lines.len() as i32;
        let cross_free = (container_cross - total_cross).max(0);
        let mut line_cross_size: Vec<i32> = lines.iter().map(|l| l.3).collect();
        // stretch: 余剰を各行へ均等分配（端数は先頭行へ）。単一行でもコンテナ全体へ伸ばす。
        if (align_content == "stretch" || align_content.is_empty()) && cross_free > 0 && nlines > 0
        {
            let per = cross_free / nlines;
            let mut rem = cross_free - per * nlines;
            for sz in line_cross_size.iter_mut() {
                *sz += per;
                if rem > 0 {
                    *sz += 1;
                    rem -= 1;
                }
            }
        }
        // 各行の開始オフセットと行間スペースを align-content から決める。
        let (ac_offset, ac_spacing) = match align_content {
            "flex-end" | "end" => (cross_free, 0),
            "center" => (cross_free / 2, 0),
            "space-between" if nlines > 1 => (0, cross_free / (nlines - 1)),
            "space-around" if nlines > 0 => (cross_free / (nlines * 2), cross_free / nlines),
            "space-evenly" if nlines > 0 => (cross_free / (nlines + 1), cross_free / (nlines + 1)),
            // flex-start / start / stretch（余剰は行サイズ側で消費済み）
            _ => (0, 0),
        };
        let mut line_cross_start: Vec<i32> = Vec::with_capacity(lines.len());
        let mut cc = ac_offset;
        for sz in &line_cross_size {
            line_cross_start.push(cc);
            cc += sz + gap_cross + ac_spacing;
        }

        for (li, &(start, end_excl, line_main_used, _line_cross_nat)) in lines.iter().enumerate() {
            let count = end_excl - start;
            let main_free = container_main - line_main_used;
            let line_cross = line_cross_size.get(li).copied().unwrap_or(0);
            let cross_cursor = line_cross_start.get(li).copied().unwrap_or(0);

            // justify-content（主軸）。`end` は `flex-end` の別名（単一行側と同じ修正）。
            let mut main_offset = match justify_content {
                "flex-end" | "end" => main_free,
                "center" => main_free / 2,
                "space-around" if count > 0 => main_free / (count as i32 * 2),
                "space-evenly" if count > 0 => main_free / (count as i32 + 1),
                _ => 0,
            };
            let spacing = match justify_content {
                "space-between" if count > 1 => main_free / (count as i32 - 1),
                "space-around" if count > 0 => main_free / (count as i32),
                "space-evenly" if count > 0 => main_free / (count as i32 + 1),
                _ => 0,
            };

            // 行内の配置順（reverse 対応）。pos は flow_idx の位置。
            let pos_list: Vec<usize> = if is_reverse {
                (start..end_excl).rev().collect()
            } else {
                (start..end_excl).collect()
            };

            for &pos in &pos_list {
                let ci = flow_idx[pos];
                let (m, c) = sizes[ci];
                let cross_free_item = line_cross - c;
                let effective_align =
                    box_align_self(&self.children[ci]).unwrap_or_else(|| String::from(align_items));
                let cross_in_line = match effective_align.as_str() {
                    "flex-end" | "end" | "self-end" => cross_free_item,
                    "center" => cross_free_item / 2,
                    _ => 0, // flex-start / start / stretch
                };
                let cross_pos = cross_cursor + cross_in_line;

                let (target_x, target_y) = if is_row {
                    (base_x + main_offset, base_y + cross_pos)
                } else {
                    (base_x + cross_pos, base_y + main_offset)
                };

                let shift_x = target_x - self.children[ci].dimensions.margin_box().x;
                let shift_y = target_y - self.children[ci].dimensions.margin_box().y;
                shift_layout_box(&mut self.children[ci], shift_x, shift_y);

                main_offset += m + spacing + gap_main;
            }
        }

        // positioned 子要素の配置（out-of-flow と relative オフセット）。
        let saved_abs_cb = self.establish_abs_cb();
        self.apply_positioned_offsets();
        Self::restore_abs_cb(saved_abs_cb);
    }

    fn layout_block(&mut self, containing_block: Dimensions) {
        self.apply_box_model_styles_with_base(containing_block.content.width);

        // テーブル系 (row-group/row/cell) も table 経由で block としてレイアウトされるため
        // ここで styled node を取り出せるようにする。取り出せない型のみ早期 return。
        let (
            width_val,
            min_width_val,
            max_width_val,
            height_val,
            min_height_val,
            box_sizing,
            h_auto,
            aspect_ratio_val,
        ) = match &self.box_type {
            BoxType::BlockNode(node)
            | BoxType::TableRowGroupNode(node)
            | BoxType::TableRowNode(node)
            | BoxType::TableCellNode(node) => (
                node.value("width"),
                node.value("min-width"),
                node.value("max-width"),
                node.value("height"),
                node.value("min-height"),
                node.value("box-sizing").unwrap_or_default(),
                margin_is_h_auto(node),
                node.value("aspect-ratio"),
            ),
            _ => return,
        };

        let horizontal_non_content = self.dimensions.margin.left
            + self.dimensions.margin.right
            + self.dimensions.border.left
            + self.dimensions.border.right
            + self.dimensions.padding.left
            + self.dimensions.padding.right;
        let available_width = containing_block.content.width.max(1);
        // padding + border のみ（box-sizing:border-box / margin:auto センタリング用）。
        let inner_non_content = self.dimensions.border.left
            + self.dimensions.border.right
            + self.dimensions.padding.left
            + self.dimensions.padding.right;

        // Calculate width
        let parsed_width = parse_length_value(width_val.clone());
        let explicit_width = !matches!(parsed_width, Some(LengthValue::Auto) | None);
        let mut content_width = match parsed_width {
            Some(LengthValue::Auto) | None => (available_width - horizontal_non_content).max(1),
            Some(LengthValue::Px(px)) => px.max(1),
            Some(LengthValue::Percent(pct)) => {
                round_f32_to_i32(available_width as f32 * pct).max(1)
            }
            // 内容ベースのキーワード: min/max/fit-content。子コンテンツを計測して解決。
            Some(LengthValue::MinContent) => {
                let (minc, _maxc) = self.block_intrinsic_widths();
                minc.max(1)
            }
            Some(LengthValue::MaxContent) => {
                let (_minc, maxc) = self.block_intrinsic_widths();
                maxc.max(1)
            }
            Some(LengthValue::FitContent) => {
                // fit-content = clamp(min-content, available, max-content)
                let avail = (available_width - horizontal_non_content).max(1);
                let (minc, maxc) = self.block_intrinsic_widths();
                maxc.min(avail).max(minc).max(1)
            }
            Some(LengthValue::MathExpr(expr)) => {
                crate::os_lib::css::eval_css_math(&expr, available_width)
                    .unwrap_or((available_width - horizontal_non_content).max(1))
                    .max(1)
            }
        };
        // box-sizing: border-box → 指定 width は border-box 全体なので content は padding+border を引く。
        // 【2026-09-26 バグ修正】auto 幅は既に padding/border を除いた残りなので対象外
        // （従来は `*{box-sizing:border-box}` の全ブロックで padding が二重に引かれていた）。
        if explicit_width && box_sizing.trim() == "border-box" {
            content_width = (content_width - inner_non_content).max(1);
        }

        // min-width / max-width。px/% は available 基準、min/max/fit-content は内容計測で解決。
        if let Some(min_width) = self.resolve_sizing_value(min_width_val.clone(), available_width) {
            content_width = content_width.max(min_width);
        }
        if let Some(max_width) = self.resolve_sizing_value(max_width_val.clone(), available_width) {
            content_width = content_width.min(max_width);
        }
        self.dimensions.content.width = content_width.max(1);

        // margin: auto（左右）→ ブロックを水平センタリング。
        if h_auto {
            let free = (available_width - content_width - inner_non_content).max(0);
            self.dimensions.margin.left = free / 2;
            self.dimensions.margin.right = free / 2;
        }

        // Position (content box origin)
        let flow_y = containing_block.content.y
            + containing_block.content.height
            + self.dimensions.margin.top;
        self.dimensions.content.x = containing_block.content.x
            + self.dimensions.margin.left
            + self.dimensions.border.left
            + self.dimensions.padding.left;
        self.dimensions.content.y =
            flow_y + self.dimensions.border.top + self.dimensions.padding.top;

        // 子の `height:%`（置換要素）の基準: 明示 px 高さ、または aspect-ratio と確定幅から。
        // 未確定なら -1（auto 扱い）。この関数を抜けると自動で戻る。
        let definite_h = match parse_length_value(height_val.clone()) {
            Some(LengthValue::Px(px)) => {
                if box_sizing.trim() == "border-box" {
                    let d = &self.dimensions;
                    (px - d.padding.top - d.padding.bottom - d.border.top - d.border.bottom).max(0)
                } else {
                    px.max(0)
                }
            }
            None | Some(LengthValue::Auto) => aspect_ratio_val
                .as_deref()
                .and_then(parse_aspect_ratio)
                .map(|(num, den)| round_f32_to_i32(self.dimensions.content.width as f32 * den / num).max(0))
                .unwrap_or(-1),
            _ => -1,
        };
        let _pct_h_guard = PctBaseHGuard::set(definite_h);

        // この要素が positioned なら、子孫 absolute の包含ブロックを self に切替（昇り解決）。
        // 高さは明示値が分かればそれ、無ければ 0（top/left 配置が主。bottom/right は明示高さ前提）。
        let self_pos = box_position(self);
        let saved_abs_cb = if matches!(self_pos.as_str(), "relative" | "absolute" | "fixed") {
            let prev = abs_cb_get();
            let exp_h = parse_length_value(height_val.clone())
                .and_then(|v| resolve_length_value(v, containing_block.content.height.max(0)))
                .unwrap_or(0);
            abs_cb_set(
                self.dimensions.content.x,
                self.dimensions.content.y,
                self.dimensions.content.width,
                exp_h,
            );
            Some(prev)
        } else {
            None
        };

        // 子要素のレイアウト計算（block/inline混在の簡易フロー）
        let line_height_default = 20i32;
        let mut y_cursor = 0i32;
        let mut line_x = 0i32;
        let mut line_h = 0i32;
        let max_w = self.dimensions.content.width.max(1);

        // float: left/right の占有幅と底辺 y を追跡する。(占有幅, 底辺y)。
        // 複数floatの左右並び積み重ねはサポートせず、各サイド最新の1個のみを追跡する
        // （画像+段落、サイドバー+本文といった典型パターンをカバーする簡易実装）。
        let mut left_float: Option<(i32, i32)> = None;
        let mut right_float: Option<(i32, i32)> = None;

        // 指定 y での float 占有を考慮した (x_offset, 利用可能幅) を返す。
        fn float_avail(
            max_w: i32,
            left_float: Option<(i32, i32)>,
            right_float: Option<(i32, i32)>,
            y: i32,
        ) -> (i32, i32) {
            let l = left_float
                .filter(|&(_, yb)| yb > y)
                .map(|(w, _)| w)
                .unwrap_or(0);
            let r = right_float
                .filter(|&(_, yb)| yb > y)
                .map(|(w, _)| w)
                .unwrap_or(0);
            (l, (max_w - l - r).max(1))
        }

        for child in &mut self.children {
            let float_side = box_float(child);
            if float_side != "none" {
                // clear: float 自身は clear の対象にはしない（float 同士は積み重ね非対応のため）。
                let float_y = y_cursor;
                let is_inline_kind =
                    matches!(child.box_type, BoxType::InlineNode(_) | BoxType::InlineBlockNode(_));
                let (fw, fh) = if is_inline_kind {
                    child.intrinsic_inline_size(max_w)
                } else {
                    let mut cb = self.dimensions.clone();
                    cb.content.height = float_y;
                    child.layout(cb);
                    (
                        child.dimensions.margin_box().width,
                        child.dimensions.margin_box().height,
                    )
                };

                let x = if float_side == "left" {
                    let x_off = left_float
                        .filter(|&(_, yb)| yb > float_y)
                        .map(|(w, _)| w)
                        .unwrap_or(0);
                    left_float = Some((x_off + fw, float_y + fh));
                    self.dimensions.content.x + x_off
                } else {
                    let x_off = right_float
                        .filter(|&(_, yb)| yb > float_y)
                        .map(|(w, _)| w)
                        .unwrap_or(0);
                    right_float = Some((x_off + fw, float_y + fh));
                    self.dimensions.content.x + max_w - x_off - fw
                };

                if is_inline_kind {
                    child.dimensions.content.x = x;
                    child.dimensions.content.y = self.dimensions.content.y + float_y;
                    child.dimensions.content.width = fw;
                    child.dimensions.content.height = fh;
                    let mut cb = child.dimensions.clone();
                    cb.content.height = 0;
                    child.layout(cb);
                    child.dimensions.content.x = x;
                    child.dimensions.content.y = self.dimensions.content.y + float_y;
                    child.dimensions.content.width = fw;
                    child.dimensions.content.height = fh;
                } else {
                    // 通常 block レイアウト済みだが、x はフロートの追加分ずれているため上書きする。
                    let dx = x - child.dimensions.content.x;
                    child.dimensions.content.x += dx;
                }
                // float はフローの縦カーソルを進めない。
                continue;
            }

            match child.box_type {
                BoxType::BlockNode(_)
                | BoxType::FlexNode(_)
                | BoxType::GridNode(_)
                | BoxType::AnonymousBlock
                | BoxType::TableNode(_)
                | BoxType::TableRowGroupNode(_)
                | BoxType::TableRowNode(_)
                | BoxType::TableCellNode(_) => {
                    let out_of_flow = matches!(box_position(child).as_str(), "absolute" | "fixed");
                    if out_of_flow {
                        // フロー外: サイズ確定のためレイアウトのみ。位置は後処理、cursor は進めない。
                        let mut cb = self.dimensions.clone();
                        cb.content.height = y_cursor;
                        child.layout(cb);
                    } else {
                        if line_x > 0 {
                            y_cursor += if line_h > 0 { line_h } else { line_height_default };
                            line_x = 0;
                            line_h = 0;
                        }
                        // clear: 該当サイドの float 底辺まで縦カーソルを進める。
                        let clear = box_clear(child);
                        if clear == "left" || clear == "both" {
                            if let Some((_, yb)) = left_float {
                                y_cursor = y_cursor.max(yb);
                            }
                        }
                        if clear == "right" || clear == "both" {
                            if let Some((_, yb)) = right_float {
                                y_cursor = y_cursor.max(yb);
                            }
                        }
                        let (x_off, avail) = float_avail(max_w, left_float, right_float, y_cursor);
                        let mut cb = self.dimensions.clone();
                        cb.content.height = y_cursor;
                        cb.content.x = self.dimensions.content.x + x_off;
                        cb.content.width = avail;
                        child.layout(cb);
                        y_cursor += child.dimensions.margin_box().height;
                    }
                }
                BoxType::InlineNode(_) | BoxType::InlineBlockNode(_) => {
                    if child.is_inline_line_break() {
                        y_cursor += if line_h > 0 { line_h } else { line_height_default };
                        line_x = 0;
                        line_h = 0;
                        child.dimensions.content.x = self.dimensions.content.x;
                        child.dimensions.content.y = self.dimensions.content.y + y_cursor;
                        child.dimensions.content.width = 0;
                        child.dimensions.content.height = 0;
                        continue;
                    }
                    let (mut x_off, mut eff_w) =
                        float_avail(max_w, left_float, right_float, y_cursor);
                    let (inline_w, inline_h) = child.intrinsic_inline_size(eff_w);
                    // 折り返し判定も inline-block の余白込みで行う（2026-09-26）。
                    let edges_w = if matches!(child.box_type, BoxType::InlineBlockNode(_)) {
                        intrinsic_h_edges(child, false)
                    } else {
                        0
                    };
                    if line_x > 0 && line_x + inline_w + edges_w > eff_w {
                        y_cursor += if line_h > 0 { line_h } else { line_height_default };
                        line_x = 0;
                        line_h = 0;
                        let recomputed = float_avail(max_w, left_float, right_float, y_cursor);
                        x_off = recomputed.0;
                        eff_w = recomputed.1;
                    }
                    let _ = eff_w;
                    child.dimensions.content.x = self.dimensions.content.x + x_off + line_x;
                    child.dimensions.content.y = self.dimensions.content.y + y_cursor;
                    child.dimensions.content.width = inline_w;
                    child.dimensions.content.height = inline_h;

                    // 子要素（InlineNode など）に対して再帰的にレイアウトを呼び出して、さらにその中の座標を決定する。
                    // 注意: layout_inline は containing.content.height を「Y フローカーソル」として
                    // 自身の y に加算する規約のため、ここで子自身の高さ (inline_h) を渡すと
                    // 子が自分の高さぶん下へずれてしまう（textarea が画面外に飛ぶバグの原因）。
                    // 確定済みスロット位置だけを伝えるため height は 0 にして渡す。
                    let mut cb = child.dimensions.clone();
                    cb.content.height = 0;
                    child.layout(cb);
                    // layout_inline 内の再計算は % 高さを包含高さ (=0) 基準で解決して
                    // 潰してしまうため、親が intrinsic 計測で確定したスロット寸法を最終値とする。
                    // 【2026-09-26 バグ修正】位置は**子孫ごと**スロットへ戻す。従来は箱の
                    // x/y だけを上書きしたため、layout_inline が margin/padding を足した位置に
                    // 組んだ中身が置き去りになり、padding 付きの inline-block
                    // （実サイトの `.btn{display:inline-block;padding:1rem 2rem}`）で
                    // 文字が箱の外へずれていた。
                    // inline-block の margin/border/padding は行内の幅・高さを占める
                    // （2026-09-26 まで content だけで並べ、padding が行頭より左へはみ出した）。
                    let (el, er, et, eb) = child.inline_block_edges();
                    let slot_x = self.dimensions.content.x + x_off + line_x + el;
                    let slot_y = self.dimensions.content.y + y_cursor + et;
                    let (dx, dy) = (slot_x - child.dimensions.content.x, slot_y - child.dimensions.content.y);
                    child.translate(dx, dy);
                    child.dimensions.content.width = inline_w;
                    child.dimensions.content.height = inline_h;

                    line_x += el + inline_w + er;
                    let outer_h = et + inline_h + eb;
                    if outer_h > line_h {
                        line_h = outer_h;
                    }
                }
            }
        }

        if line_x > 0 {
            y_cursor += if line_h > 0 { line_h } else { line_height_default };
        }
        // float は通常のフロー高さに寄与しないため、コンテナが「潰れて」floatだけが
        // はみ出す見た目を避けるべく、底辺を高さに含める（簡易実装の割り切り）。
        if let Some((_, yb)) = left_float {
            y_cursor = y_cursor.max(yb);
        }
        if let Some((_, yb)) = right_float {
            y_cursor = y_cursor.max(yb);
        }

        // 【2026-08-31】CSS 多段組（`column-count`/`column-width`/`columns`）。
        //
        // 縦フローで子を積み終えたこの時点で、**各子を列へ振り分け直す**
        // 後処理として実装する。先に通常フローを完成させてから x/y を
        // 移し替えるので、幅計算・マージン相殺・float 等の既存経路を
        // 一切変更せずに済む（新しいレイアウトモードを足すより安全）。
        //
        // 割り切り: 段抜き（`column-span`）・段区切り（`break-inside`）・
        // 段罫線（`column-rule`）は未対応。子は「積んだ順に、各列の高さが
        // 均等になるよう」振り分ける（厳密なバランシングではなく、
        // 各列の現在高さが最小の列へ順に入れる貪欲法）。
        if let BoxType::BlockNode(node) = &self.box_type {
            let cc = node.value("column-count");
            let cw = node.value("column-width");
            let shorthand = node.value("columns");
            let (sh_w, sh_c) = shorthand
                .as_deref()
                .map(crate::os_lib::layout::multicol::parse_columns_shorthand)
                .unwrap_or((None, None));
            let parse_px = |v: &Option<String>| -> Option<i32> {
                v.as_deref()
                    .and_then(|s| s.trim().strip_suffix("px"))
                    .and_then(|n| n.trim().parse::<f32>().ok())
                    .filter(|f| f.is_finite() && *f > 0.0)
                    .map(|f| f as i32)
            };
            let count = cc
                .as_deref()
                .and_then(|s| s.trim().parse::<i32>().ok())
                .filter(|v| *v > 0)
                .or(sh_c);
            let width = parse_px(&cw).or(sh_w);
            if count.is_some() || width.is_some() {
                // `column-gap` の既定 `normal` は 1em 相当。フォントサイズが
                // 取れないときは 16px を既定にする（CSS の初期値と一致）。
                let gap = node
                    .value("column-gap")
                    .as_deref()
                    .and_then(|s| s.trim().strip_suffix("px"))
                    .and_then(|n| n.trim().parse::<f32>().ok())
                    .filter(|f| f.is_finite() && *f >= 0.0)
                    .map(|f| f as i32)
                    .unwrap_or(16);
                let spec = crate::os_lib::layout::multicol::MultiColSpec { count, width, gap };
                let cols = crate::os_lib::layout::multicol::layout_columns(
                    &spec,
                    self.dimensions.content.width.max(0),
                );
                if cols.len() > 1 {
                    let base_x = self.dimensions.content.x;
                    let base_y = self.dimensions.content.y;
                    // 振り分けは純粋関数へ委ねる（`multicol::assign_to_columns`、
                    // 単体試験あり）。ここで手書きループを持つと、
                    // 「同値なら左の列を優先」等の細かい規則が試験から外れる。
                    // float や絶対配置は通常フローから外れているので対象外。
                    let flow_idx: alloc::vec::Vec<usize> = self
                        .children
                        .iter()
                        .enumerate()
                        .filter(|(_, c)| box_float(c) == "none")
                        .map(|(i, _)| i)
                        .collect();
                    let heights: alloc::vec::Vec<i32> = flow_idx
                        .iter()
                        .map(|&i| self.children[i].dimensions.margin_box().height)
                        .collect();
                    let places =
                        crate::os_lib::layout::multicol::assign_to_columns(&heights, cols.len());
                    for (slot, &ci) in flow_idx.iter().enumerate() {
                        let place = places[slot];
                        let col = cols[place.col];
                        let child = &mut self.children[ci];
                        // 子の左上を列の座標へ移す（子孫も相対的にずれるよう
                        // 差分で平行移動する）。
                        let dx = base_x + col.x - child.dimensions.content.x
                            + child.dimensions.margin.left
                            + child.dimensions.border.left
                            + child.dimensions.padding.left;
                        let dy = base_y + place.y - child.dimensions.content.y
                            + child.dimensions.margin.top
                            + child.dimensions.border.top
                            + child.dimensions.padding.top;
                        child.translate(dx, dy);
                        child.dimensions.content.width = (col.width
                            - child.dimensions.margin.left
                            - child.dimensions.margin.right
                            - child.dimensions.border.left
                            - child.dimensions.border.right
                            - child.dimensions.padding.left
                            - child.dimensions.padding.right)
                            .max(0);
                    }
                    // 多段組の高さは最も高い列に合わせる（同じ貪欲法で集計する）。
                    let totals =
                        crate::os_lib::layout::multicol::column_heights(&heights, cols.len());
                    y_cursor = totals.iter().copied().max().unwrap_or(y_cursor);
                }
            }
        }

        // Block要素の高さは内容フローの高さ。ただし明示 height / min-height があれば優先。
        self.dimensions.content.height = y_cursor;
        let cb_height = containing_block.content.height.max(0);
        if let Some(h) =
            parse_length_value(height_val.clone()).and_then(|v| resolve_length_value(v, cb_height))
        {
            // box-sizing:border-box は指定 height から縦 padding+border を引いて content 高に。
            let vertical_non_content = self.dimensions.border.top
                + self.dimensions.border.bottom
                + self.dimensions.padding.top
                + self.dimensions.padding.bottom;
            let content_h = if box_sizing.trim() == "border-box" {
                (h - vertical_non_content).max(0)
            } else {
                h.max(0)
            };
            self.dimensions.content.height = content_h;
        }
        if let Some(mh) =
            parse_length_value(min_height_val).and_then(|v| resolve_length_value(v, cb_height))
        {
            self.dimensions.content.height = self.dimensions.content.height.max(mh);
        }

        // aspect-ratio: W/H。height が auto なら width から height を補完、
        // 逆に width が auto かつ height 明示なら height から width を補完する。
        if let Some((num, den)) = aspect_ratio_val.as_deref().and_then(parse_aspect_ratio) {
            let width_is_auto = matches!(
                parse_length_value(width_val.clone()),
                Some(LengthValue::Auto) | None
            );
            let height_is_auto = parse_length_value(height_val.clone()).is_none();
            if height_is_auto {
                // width 確定 → height = width * den / num
                self.dimensions.content.height =
                    round_f32_to_i32(self.dimensions.content.width as f32 * den / num).max(1);
            } else if width_is_auto {
                // height 明示・width auto → width = height * num / den（min/max-width で後段クランプ済みだが
                // ここで上書きするため、再度 min/max-width 制約を適用する）。
                let h = self.dimensions.content.height as f32;
                let mut w = round_f32_to_i32(h * num / den).max(1);
                if let Some(min_w) = parse_length_value(min_width_val.clone())
                    .and_then(|v| resolve_length_value(v, available_width))
                {
                    w = w.max(min_w);
                }
                if let Some(max_w) = parse_length_value(max_width_val.clone())
                    .and_then(|v| resolve_length_value(v, available_width))
                {
                    w = w.min(max_w);
                }
                self.dimensions.content.width = w.max(1);
            }
        }

        // text-align の後処理: center / right でインライン子要素のx座標を調整
        // text-align 未指定時は `direction` に応じた既定値（初期値 `start` の簡易解決）を使う:
        // rtl なら right 相当、それ以外（既定 ltr）は従来どおり left（無指定=無調整）。
        let (text_align, direction, text_align_last) = match &self.box_type {
            BoxType::BlockNode(node) | BoxType::TableCellNode(node) => (
                node.value("text-align").unwrap_or_default(),
                node.value("direction").unwrap_or_default(),
                node.value("text-align-last").unwrap_or_default(),
            ),
            _ => (String::new(), String::new(), String::new()),
        };
        let is_rtl = direction.trim().eq_ignore_ascii_case("rtl");
        let mut ta = text_align.trim().to_lowercase();
        if ta.is_empty() && is_rtl {
            ta = String::from("right");
        }
        // `start`/`end`（CSS Logical Properties）は `direction` に応じて left/right へ
        // 解決する（`float`/`clear` の `inline-start`/`inline-end` と同じ考え方）。
        ta = match ta.as_str() {
            "start" => String::from(if is_rtl { "right" } else { "left" }),
            "end" => String::from(if is_rtl { "left" } else { "right" }),
            _ => ta,
        };
        // text-align-last: 最終行のみ text-align とは別の値で揃える（justify と組み合わせて
        // 最終行だけ left/center/right にする用途向け）。`auto`/未指定/`justify`（非対応）は
        // 最終行も通常の `ta` に従う。`start`/`end` も同様に direction で解決する。
        let ta_last_resolved = match text_align_last.trim().to_lowercase().as_str() {
            "start" => String::from(if is_rtl { "right" } else { "left" }),
            "end" => String::from(if is_rtl { "left" } else { "right" }),
            other => String::from(other),
        };
        let ta_last_effective = if matches!(ta_last_resolved.as_str(), "left" | "center" | "right")
        {
            Some(ta_last_resolved)
        } else {
            None
        };
        if ta == "center" || ta == "right" || ta == "justify" || ta_last_effective.is_some() {
            let content_w = self.dimensions.content.width.max(1);
            let n = self.children.len();

            // インライン子要素のy座標を集めてラインを識別
            let mut line_ys: Vec<i32> = Vec::new();
            for ci in 0..n {
                match self.children[ci].box_type {
                    BoxType::InlineNode(_) | BoxType::InlineBlockNode(_) => {
                        // 行の判定は余白込みの上端で行う（padding 付き inline-block は content が
                        // 下へずれるため、content.y だと別の行とみなされていた。2026-09-26）。
                        let cy = self.children[ci].dimensions.content.y
                            - self.children[ci].inline_block_edges().2;
                        if !line_ys.contains(&cy) {
                            line_ys.push(cy);
                        }
                    }
                    _ => {}
                }
            }
            let last_line_y = line_ys.iter().copied().max();

            for line_y in line_ys {
                // そのラインの子要素インデックスと合計幅を計算
                let mut line_indices = Vec::new();
                let mut total_w = 0i32;
                for ci in 0..n {
                    match self.children[ci].box_type {
                        BoxType::InlineNode(_) | BoxType::InlineBlockNode(_)
                            if self.children[ci].dimensions.content.y
                                - self.children[ci].inline_block_edges().2
                                == line_y =>
                        {
                            line_indices.push(ci);
                            // inline-block は margin/border/padding も行幅を占める
                            // （2026-09-26。中身の幅だけで合計すると中央寄せが余白分右へずれ、
                            // forms.htm のボタンが右端からはみ出した）。
                            let (el, er, _, _) = self.children[ci].inline_block_edges();
                            total_w += el + self.children[ci].dimensions.content.width + er;
                        }
                        _ => {}
                    }
                }

                let is_last_line = last_line_y == Some(line_y);
                let effective_ta = if is_last_line {
                    ta_last_effective.as_deref().unwrap_or(if ta == "justify" {
                        if is_rtl { "right" } else { "left" }
                    } else {
                        ta.as_str()
                    })
                } else {
                    ta.as_str()
                };

                if effective_ta == "justify" {
                    let k = line_indices.len();
                    if k > 1 {
                        let remaining = (content_w - total_w).max(0);
                        for (i, &ci) in line_indices.iter().enumerate() {
                            let shift = (remaining * i as i32) / (k as i32 - 1);
                            // 子孫ごと動かす（下の center/right と同じ理由）。
                            self.children[ci].translate(shift, 0);
                        }
                    }
                } else {
                    let offset = match effective_ta {
                        "center" => ((content_w - total_w) / 2).max(0),
                        "right" => (content_w - total_w).max(0),
                        _ => 0,
                    };
                    if offset > 0 {
                        // 【2026-09-26 バグ修正】従来は箱の x だけを書き換え、中身
                        // （inline-block の文字ノード等）を元の位置に残していた。
                        // 実サイトの中央寄せ見出し下の段落で文字が 500px 左に取り残された。
                        for &ci in &line_indices {
                            self.children[ci].translate(offset, 0);
                        }
                    }
                }
            }
        }

        // position の後処理（relative/absolute/fixed の配置 + transform）を共有メソッドで適用。
        self.apply_positioned_offsets();

        // 子孫のために切替えた ABS_CB を復元（positioned 要素のみ切替えていた）。
        if let Some(prev) = saved_abs_cb {
            abs_cb_set(prev.0, prev.1, prev.2, prev.3);
        }
    }

    /// avail_hint: 包含ブロックのコンテンツ幅。テキスト折り返し計測に使う。
    /// （以前は固定 800px フォールバックだったため、実コンテナ幅と食い違い
    ///   layout の行数 < flatten の行数 となって後続要素と重なるバグがあった）
    /// 内容ベースの寸法を返す。`avail_hint` は折り返しに使える幅。
    ///
    /// `pure` が真なら**現在の箱の幅を見ない**。内在幅
    /// （min-content / max-content）の算出専用の入口で、
    /// `block_intrinsic_widths` だけが真を渡す。
    ///
    /// 内在幅は「今どう組まれているか」に依存してはいけない値だが、
    /// この関数は内在幅以外の用途（表の列幅・インライン配置など）でも
    /// 呼ばれており、そちらは現在の幅を前提にしている。
    /// 【2026-09-05】一度この区別をせずに順序だけ入れ替えたところ、
    /// ヒーローの見出しが 2 行に折り返す退行を招いて戻した。
    /// 入口を分けることで、内在幅の算出だけを正す。
    fn intrinsic_inline_size_ext(&self, avail_hint: i32, pure: bool) -> (i32, i32) {
        // inline-flex / inline-grid: 幅は内在幅（shrink-to-fit）、高さは試し組みで測る。
        if self.is_inline_flex() || self.is_inline_grid() {
            if pure {
                let (minc, maxc) = self.block_intrinsic_widths();
                return (if avail_hint <= 1 { minc } else { maxc }, 0);
            }
            let w = self.inline_flex_content_width(avail_hint);
            let mut probe = self.clone();
            probe.layout_as_flex_at(0, 0, w);
            return (w, probe.dimensions.content.height.max(0));
        }
        match &self.box_type {
            BoxType::InlineNode(node) | BoxType::InlineBlockNode(node) => {
                // `%` 幅は包含ブロック基準。純粋な内在幅の計測中（pure）は基準が
                // 無いので auto（自然サイズ）扱い（2026-09-26 まではビューポート基準）。
                let base = if pure { None } else { Some(avail_hint) };
                if let Some(size) = get_replaced_element_size_in(node, base) {
                    return size;
                }
                let font_size = node
                    .value("font-size")
                    .and_then(|v| parse_font_size_u32(&v))
                    .unwrap_or(16);
                let line_height_val = node.value("line-height");
                let line_height = parse_line_height(line_height_val, font_size);

                // Check for explicit CSS width/height (e.g., inline-block with width: 200px)
                // `width: 50%`等の百分率が以前は完全に無視されており（`LengthValue::Px`
                // のみ対応）、`<iframe width="100%">`のようなレガシー属性経由の百分率
                // 指定（cascade.rsでCSS `width`へマッピング済み）が正しくサイズに
                // 反映されないバグだった。`avail_hint`（包含ブロックのコンテンツ幅）
                // 基準で解決する（2026-07-21発見・修正。実サイト www.sugi-lab.net の
                // Access ページの地図埋め込みで発覚）。
                let css_w = node.value("width").and_then(|v| match parse_length_value(Some(v)) {
                    Some(LengthValue::Px(px)) => Some(px),
                    Some(LengthValue::Percent(pct)) => {
                        Some(round_f32_to_i32(avail_hint as f32 * pct))
                    }
                    _ => None,
                });
                let css_h = node
                    .value("height")
                    .and_then(|v| match parse_length_value(Some(v)) {
                        Some(LengthValue::Px(px)) => Some(px),
                        _ => None,
                    });

                match &node.node.node_type {
                    NodeType::Text(text) => {
                        // white-space: nowrap/pre は折り返さない（1行に収める）。
                        // white-space は継承プロパティなのでテキストノード自身の
                        // styled node にも祖先から伝播済みの値が入っている。
                        let nowrap = matches!(
                            node.value("white-space").as_deref(),
                            Some("nowrap") | Some("pre")
                        );
                        let pre_wrap = matches!(
                            node.value("white-space").as_deref(),
                            Some("pre-wrap") | Some("pre-line")
                        );
                        let break_all = matches!(
                            node.value("word-break").as_deref(),
                            Some("break-all")
                        ) || matches!(
                            node.value("overflow-wrap").as_deref(),
                            Some("break-word")
                        );
                        // 【2026-09-05】`avail_hint` を優先する形へ変えたが、
                        // ヒーローの見出しが 2 行に折り返す退行を招いたため戻した。
                        //
                        // 内在幅は本来「今どう組まれているか」に依存しない値で、
                        // 現在の箱の幅を先に見るのは正しくない（min を求めても
                        // max を求めても同じ値が返る）。ただしこの関数は
                        // 内在幅の算出以外からも呼ばれており、そちらは
                        // 現在の幅を前提にしている。直すなら**呼び出し側を
                        // 全部見てから**にすること。詳細は `spec/flex_min_size.md`。
                        let available = if nowrap {
                            i32::MAX / 2
                        } else {
                            css_w.unwrap_or({
                                if pure {
                                    // 内在幅の算出。今の箱の幅は見ない。
                                    if avail_hint > 0 {
                                        avail_hint
                                    } else {
                                        800
                                    }
                                } else if self.dimensions.content.width > 0 {
                                    // 【2026-09-26 バグ修正】前回組んだ幅が今回の利用可能幅より
                                    // 広ければ今回の幅で折り返す。flex の縮小などで組み直すと、
                                    // 文字だけが縮小前の広い幅のまま折り返し、箱の外へはみ出して
                                    // いた（profile.htm の研究概要）。狭い側は従来どおり前回の幅
                                    // （全面的に今回の幅へ切り替えるとヒーロー見出しが退行した。
                                    // 2026-09-05 の記録）。
                                    if avail_hint > 0 {
                                        self.dimensions.content.width.min(avail_hint)
                                    } else {
                                        self.dimensions.content.width
                                    }
                                } else if avail_hint > 0 {
                                    avail_hint
                                } else {
                                    800
                                }
                            })
                        };
                        let ls = parse_letter_spacing_ctx(node.value("letter-spacing").as_deref(), available);
                        let ws = parse_word_spacing_ctx(node.value("word-spacing").as_deref(), available);
                        // 描画側と同じ規則で空白を畳んでから測る（2026-09-26。
                        // 畳まずに測ると HTML の字下げの分だけ箱が広く・高くなる）。
                        let text = &crate::os_lib::layout::line_break::collapse_white_space(
                            text,
                            &node.value("white-space").unwrap_or_default(),
                        );
                        // 描画と同じ書体（font-family・太字）で折り返し行数を測る（2026-09-26）。
                        let (fam, bold) = text_font_of(node);
                        let (w, h) = crate::kernel::vector_font::get_vector_string_wrapped_size_family(
                            text,
                            font_size,
                            available as u32,
                            ls,
                            ws,
                            break_all,
                            pre_wrap,
                            &fam,
                            bold,
                        );
                        let lines = h as i32 / (font_size as i32 + 4).max(1);
                        (
                            css_w.unwrap_or(w as i32),
                            css_h.unwrap_or(lines * line_height),
                        )
                    }
                    NodeType::Element { tag_name, .. } => {
                        if tag_name == "br" {
                            (0, line_height)
                        } else {
                            let (content_w, content_h) = if self.children.is_empty() {
                                (8, line_height)
                            } else {
                                let mut total_w = 0i32;
                                let mut max_h = line_height;
                                // inline-block の中身は、利用可能幅から自分の左右の余白を引いた幅で
                                // 組む（shrink-to-fit。2026-09-26。引かないと中の文字が折り返さず、
                                // forms.htm の長いボタンがカードの右へはみ出した）。
                                let avail_hint = if matches!(self.box_type, BoxType::InlineBlockNode(_))
                                    && avail_hint > 0
                                    && avail_hint < 1_000_000
                                {
                                    (avail_hint - intrinsic_h_edges(self, css_w.is_some())).max(1)
                                } else {
                                    avail_hint
                                };
                                for child in &self.children {
                                    // 【2026-09-05】ここは `pure` を**引き継がない**。
                                    //
                                    // 引き継ぐと入れ子の要素の内在幅が変わり、
                                    // ナビ項目の間隔が潰れる退行が出た
                                    // （実測。ロゴの重なりは解消しないまま
                                    // 悪化だけした）。理屈の上では引き継ぐのが
                                    // 正しいはずで、引き継いで壊れるということは
                                    // **どこかが非 pure の値に依存している**。
                                    // 直すならその依存を先に突き止めること。
                                    let (cw, ch) = child.intrinsic_inline_size(avail_hint);
                                    total_w += cw;
                                    if ch > max_h {
                                        max_h = ch;
                                    }
                                }
                                (total_w, max_h)
                            };
                            (css_w.unwrap_or(content_w), css_h.unwrap_or(content_h))
                        }
                    }
                }
            }
            _ => (0, 0),
        }
    }

    /// 従来どおりの入口（現在の箱の幅を見る）。
    fn intrinsic_inline_size(&self, avail_hint: i32) -> (i32, i32) {
        self.intrinsic_inline_size_ext(avail_hint, false)
    }

    fn layout_inline(&mut self, containing_block: Dimensions, _block_like: bool) {
        self.apply_box_model_styles_with_base(containing_block.content.width);

        let (width_val, min_width_val, max_width_val, height_val, min_height_val, max_height_val) =
            match &self.box_type {
                BoxType::InlineNode(node) | BoxType::InlineBlockNode(node) => (
                    node.value("width"),
                    node.value("min-width"),
                    node.value("max-width"),
                    node.value("height"),
                    node.value("min-height"),
                    node.value("max-height"),
                ),
                _ => return,
            };

        let available_width = containing_block.content.width.max(1);
        let available_height = containing_block.content.height.max(1);
        let (intrinsic_w, intrinsic_h) = self.inline_content_intrinsic_size(available_width);

        let mut content_width = match parse_length_value(width_val) {
            Some(LengthValue::Auto) | None => intrinsic_w.max(1),
            Some(LengthValue::Px(px)) => px.max(1),
            Some(LengthValue::Percent(pct)) => {
                round_f32_to_i32(available_width as f32 * pct).max(1)
            }
            Some(LengthValue::MinContent) => {
                let (minc, _maxc) = self.block_intrinsic_widths();
                minc.max(1)
            }
            Some(LengthValue::MaxContent) => {
                let (_minc, maxc) = self.block_intrinsic_widths();
                maxc.max(1)
            }
            Some(LengthValue::FitContent) => {
                let (minc, maxc) = self.block_intrinsic_widths();
                available_width.min(maxc).max(minc).max(1)
            }
            Some(LengthValue::MathExpr(expr)) => {
                crate::os_lib::css::eval_css_math(&expr, available_width)
                    .unwrap_or(intrinsic_w.max(1))
                    .max(1)
            }
        };
        if let Some(min_width) =
            parse_length_value(min_width_val).and_then(|v| resolve_length_value(v, available_width))
        {
            content_width = content_width.max(min_width);
        }
        if let Some(max_width) =
            parse_length_value(max_width_val).and_then(|v| resolve_length_value(v, available_width))
        {
            content_width = content_width.min(max_width);
        }

        let mut content_height = match parse_length_value(height_val) {
            Some(LengthValue::Auto)
            | Some(LengthValue::MinContent)
            | Some(LengthValue::MaxContent)
            | Some(LengthValue::FitContent)
            | None => intrinsic_h.max(1),
            Some(LengthValue::Px(px)) => px.max(1),
            // 【2026-09-26 バグ修正】`%` 高さは包含ブロックの高さが確定しているときだけ
            // 有効（仕様では未確定なら auto）。ここの `containing_block.content.height` は
            // 呼び出し側の縦カーソル位置（flex の計測では 0）で高さではないため、
            // `img{max-height:100%}` が 1px に潰れていた。auto として扱う。
            Some(LengthValue::Percent(_)) => intrinsic_h.max(1),
            Some(LengthValue::MathExpr(expr)) => {
                crate::os_lib::css::eval_css_math(&expr, available_height)
                    .unwrap_or(intrinsic_h.max(1))
                    .max(1)
            }
        };
        if let Some(min_height) = parse_length_value(min_height_val)
            .filter(|v| !matches!(v, LengthValue::Percent(_)))
            .and_then(|v| resolve_length_value(v, available_height))
        {
            content_height = content_height.max(min_height);
        }
        if let Some(max_height) = parse_length_value(max_height_val)
            .filter(|v| !matches!(v, LengthValue::Percent(_)))
            .and_then(|v| resolve_length_value(v, available_height))
        {
            content_height = content_height.min(max_height);
        }

        self.dimensions.content.width = content_width.max(1);
        self.dimensions.content.height = content_height.max(1);
        self.dimensions.content.x = containing_block.content.x
            + self.dimensions.margin.left
            + self.dimensions.border.left
            + self.dimensions.padding.left;
        self.dimensions.content.y = containing_block.content.y
            + containing_block.content.height
            + self.dimensions.margin.top
            + self.dimensions.border.top
            + self.dimensions.padding.top;

        // 子要素のレイアウト計算を行う。インライン要素（!block_like）であっても、
        // 内包するテキストや子インライン要素の座標を設定する必要があるため、常に実行します。
        let mut child_flow_x = 0i32;
        let mut child_flow_y = 0i32;
        let mut line_h = 0i32;
        let max_w = self.dimensions.content.width.max(1);
        // インライン/インラインブロックの vertical-align（既定 top/baseline は無調整）: 1行の
        // 全子要素が揃って初めて行の高さ(line_h)が確定するため、行の開始インデックスを覚えておき、
        // 改行が確定した時点でその行の子要素だけを事後的に `translate_y` でシフトする。
        let mut line_start_idx = 0usize;

        let mut i = 0usize;
        while i < self.children.len() {
            match self.children[i].box_type {
                BoxType::BlockNode(_)
                | BoxType::FlexNode(_)
                | BoxType::GridNode(_)
                | BoxType::TableNode(_)
                | BoxType::TableRowGroupNode(_)
                | BoxType::TableRowNode(_)
                | BoxType::TableCellNode(_) => {
                    if child_flow_x > 0 {
                        self.finalize_inline_line_vertical_align(line_start_idx, i, line_h, max_w);
                        child_flow_y += line_h;
                        child_flow_x = 0;
                        line_h = 0;
                    }
                    line_start_idx = i + 1;
                    let child = &mut self.children[i];
                    let mut cb = self.dimensions.clone();
                    cb.content.height = child_flow_y;
                    child.layout(cb);
                    child_flow_y += child.dimensions.margin_box().height;
                    // 【2026-09-26 バグ修正】この `i += 1` が抜けており、インライン要素の
                    // 中にブロックの子があると（`<a><div>..</div></a>` 等、実サイトで
                    // ごく普通の形）同じ子を永遠にレイアウトし続けて**ブラウザが固まって**いた。
                    i += 1;
                }
                BoxType::InlineNode(_) | BoxType::InlineBlockNode(_) => {
                    if self.children[i].is_inline_line_break() {
                        self.finalize_inline_line_vertical_align(line_start_idx, i, line_h, max_w);
                        child_flow_y += line_h.max(20);
                        child_flow_x = 0;
                        line_h = 0;
                        line_start_idx = i + 1;
                        i += 1;
                        continue;
                    }
                    let (child_w, child_h) = self.children[i].intrinsic_inline_size(max_w);
                    if child_flow_x > 0 && child_flow_x + child_w > max_w {
                        self.finalize_inline_line_vertical_align(line_start_idx, i, line_h, max_w);
                        child_flow_y += line_h.max(20);
                        child_flow_x = 0;
                        line_h = 0;
                        line_start_idx = i;
                    }
                    let child = &mut self.children[i];
                    child.dimensions.content.x = self.dimensions.content.x + child_flow_x;
                    child.dimensions.content.y = self.dimensions.content.y + child_flow_y;
                    child.dimensions.content.width = child_w;
                    child.dimensions.content.height = child_h;

                    // 子要素（InlineNode など）に対して再帰的にレイアウトを呼び出して、さらにその中の座標を決定する。
                    // 注意: 子自身が InlineNode/InlineBlockNode の場合、渡した cb.content.height
                    // （ここでは子自身の高さ）を子の layout_inline が「Y フローカーソル」として
                    // 自身の content.y に加算してしまい、確定済みのスロット位置を上書きしてしまう
                    // （layout_block の inline 子ループに既存の同種ワークアラウンドと同じ理由）。
                    // そのため子のレイアウト後に確定済みのスロット位置へ再設定する。
                    let cb = child.dimensions.clone();
                    child.layout(cb);
                    // 子孫ごとスロットへ戻す（layout_block の inline 子と同じ理由。2026-09-26）。
                    let (el, er, et, eb) = child.inline_block_edges();
                    let slot_x = self.dimensions.content.x + child_flow_x + el;
                    let slot_y = self.dimensions.content.y + child_flow_y + et;
                    let (dx, dy) = (slot_x - child.dimensions.content.x, slot_y - child.dimensions.content.y);
                    child.translate(dx, dy);
                    child.dimensions.content.width = child_w;
                    child.dimensions.content.height = child_h;

                    child_flow_x += el + child_w + er;
                    let outer_h = et + child_h + eb;
                    if outer_h > line_h {
                        line_h = outer_h;
                    }
                    i += 1;
                }
                BoxType::AnonymousBlock => {
                    i += 1;
                }
            }
        }
        // 最終行（末尾に改行/ブロック要素が無いまま終わる行）の vertical-align を適用する。
        self.finalize_inline_line_vertical_align(line_start_idx, self.children.len(), line_h, max_w);
    }

    /// インラインの1行ぶん（`[start, end)` の子要素）に `vertical-align` を適用する。
    /// **簡略化**: `top`/`baseline`/`sub`/`super`/`text-top` はいずれも無調整（top相当）、
    /// `middle` は行の中央、`bottom`/`text-bottom` は行の下端に揃える。table セルの
    /// vertical-align（内容のみシフト）とは異なり、ここでは子要素自身（背景/境界線含む）を
    /// まるごとシフトする（インラインボックス自体の行内配置を変えるのが目的のため）。
    fn finalize_inline_line_vertical_align(&mut self, start: usize, end: usize, line_h: i32, max_w: i32) {
        if line_h <= 0 || end <= start {
            return;
        }
        for idx in start..end {
            let Some(child) = self.children.get_mut(idx) else {
                continue;
            };
            if !matches!(
                child.box_type,
                BoxType::InlineNode(_) | BoxType::InlineBlockNode(_)
            ) {
                continue;
            }
            let va = box_style_value(child, "vertical-align").unwrap_or_default();
            let offset = match va.trim() {
                "middle" => {
                    let (_, child_h) = child.intrinsic_inline_size(max_w);
                    (line_h - child_h) / 2
                }
                "bottom" | "text-bottom" => {
                    let (_, child_h) = child.intrinsic_inline_size(max_w);
                    line_h - child_h
                }
                _ => 0,
            };
            if offset != 0 {
                child.translate_y(offset);
            }
        }
    }

    /// min-width/max-width 等のサイジング値を解決する。px/% は base 基準、
    /// `min-content`/`max-content`/`fit-content` は内容計測で解決。auto/未指定は None。
    fn resolve_sizing_value(&self, value: Option<String>, base: i32) -> Option<i32> {
        match parse_length_value(value)? {
            LengthValue::Auto => None,
            LengthValue::Px(px) => Some(px),
            LengthValue::Percent(pct) => Some(round_f32_to_i32(base as f32 * pct)),
            LengthValue::MinContent => Some(self.block_intrinsic_widths().0),
            LengthValue::MaxContent => Some(self.block_intrinsic_widths().1),
            LengthValue::FitContent => {
                let (minc, maxc) = self.block_intrinsic_widths();
                Some(maxc.min(base.max(0)).max(minc))
            }
            LengthValue::MathExpr(expr) => crate::os_lib::css::eval_css_math(&expr, base),
        }
    }

    /// ブロック要素の内容ベース幅を返す: (min_content, max_content)。
    /// max_content = 折返しなしの最大行幅、min_content = 最大限折返したときの最小幅。
    /// 直下の子（inline/text/block）を計測して集約する。
    fn block_intrinsic_widths(&self) -> (i32, i32) {
        // 自身が inline/inline-block を直接表すなら、その計測を使う
        // （inline-flex は下の flex コンテナの計測へ回す）。
        if matches!(
            self.box_type,
            BoxType::InlineNode(_) | BoxType::InlineBlockNode(_)
        ) && !self.is_inline_flex()
            && !self.is_inline_grid()
        {
            let max_c = self.intrinsic_inline_size_ext(1_000_000, true).0;
            let min_c = self.intrinsic_inline_size_ext(1, true).0;
            return (min_c.max(0), max_c.max(min_c).max(0));
        }
        // 【2026-09-04】横並びの flex コンテナは、子を**足し合わせる**。
        //
        // 従来はブロックとして「子は縦に積む」前提で最大値を取っていた。
        // その結果、ナビの `ul`（`display:flex` の 8 項目）の max-content が
        // 最も広い 1 項目ぶん（80px）になり、本来の 656px と大きく食い違って
        // いた。親の flex は基準幅にこの値を使うので、ナビが極端に小さく
        // 見積もられ、`justify-content:space-between` で右へ飛んでいた。
        //
        // 折り返さない（`flex-wrap: nowrap`、既定）横並びなら、
        // min-content も max-content も**子の総和**になる。
        // inline-grid: 列がすべて px なら「列幅の合計 + 列間 gap」（2026-09-26）。
        // fr/auto 等を含む場合は下の汎用計測（子の最大）に任せる。
        if let BoxType::InlineBlockNode(node) = &self.box_type {
            if self.is_inline_grid() {
                let cols = parse_grid_tracks(
                    node.value("grid-template-columns").as_deref().unwrap_or(""),
                    0,
                );
                let all_px: Option<i32> = if cols.is_empty() {
                    None
                } else {
                    cols.iter().try_fold(0i32, |acc, t| match t {
                        GridTrack::Px(px) => Some(acc + (*px).max(0)),
                        _ => None,
                    })
                };
                if let Some(sum) = all_px {
                    let (_, cg) = parse_flex_gap(node, 0);
                    let w = sum + cg.max(0) * (cols.len() as i32 - 1).max(0);
                    return (w, w);
                }
            }
        }
        let flex_node = match &self.box_type {
            BoxType::FlexNode(n) => Some(*n),
            BoxType::InlineBlockNode(n) if self.is_inline_flex() => Some(*n),
            _ => None,
        };
        if let Some(node) = flex_node {
            let dir = node
                .value("flex-direction")
                .unwrap_or_else(|| alloc::string::String::from("row"))
                .trim()
                .to_lowercase();
            let is_row = !dir.starts_with("column");
            let wraps = node
                .value("flex-wrap")
                .map(|w| w.trim().to_lowercase().starts_with("wrap"))
                .unwrap_or(false);
            if is_row {
                let mut sum_min = 0i32;
                let mut sum_max = 0i32;
                let mut max_min = 0i32;
                for child in &self.children {
                    // 【2026-09-26】項目に明示の px 幅があれば、行の内在幅への寄与はその値
                    // （中身から測ると `width:30px` の空ブロックが 8px 等になり、
                    // inline-flex の幅が狂った）。項目自身の block_intrinsic_widths は
                    // flex の自動最小サイズ（中身基準であるべき）にも使われるので、
                    // そちらは変えずにここでだけ差し替える。
                    let explicit = match parse_length_value(box_style_value(child, "width")) {
                        Some(LengthValue::Px(px)) => Some(px.max(0)),
                        _ => None,
                    };
                    let (cmin, cmax) = explicit.map(|w| (w, w)).unwrap_or_else(|| child.block_intrinsic_widths());
                    let (cmin, cmax) = clamp_contribution(child, cmin, cmax);
                    let edges = intrinsic_h_edges(child, explicit.is_some());
                    let (cmin, cmax) = (cmin + edges, cmax + edges);
                    sum_min += cmin;
                    sum_max += cmax;
                    max_min = max_min.max(cmin);
                }
                let (rg, cg) = parse_flex_gap(node, self.dimensions.content.width);
                let _ = rg;
                let n = self.children.len() as i32;
                let gaps = if n > 1 { cg * (n - 1) } else { 0 };
                // 折り返す指定なら、最小は 1 項目ぶんまで詰められる。
                let min_c = if wraps { max_min } else { sum_min + gaps };
                return (min_c.max(0), (sum_max + gaps).max(min_c).max(0));
            }
        }

        // ブロックは子を集約。インライン子は同一行に並ぶため max は加算・min は最大。
        // ブロック子は縦に積むため両者とも最大。
        let mut inline_max = 0i32; // 現在のインライン連なりの max-content 合計
        let mut overall_max = 0i32;
        let mut overall_min = 0i32;
        for child in &self.children {
            match child.box_type {
                BoxType::InlineNode(_) | BoxType::InlineBlockNode(_) => {
                    // intrinsic_inline_size は inline-block の明示 width を尊重する。
                    let cmax = child.intrinsic_inline_size_ext(1_000_000, true).0;
                    let cmin = child.intrinsic_inline_size_ext(1, true).0;
                    inline_max += cmax;
                    overall_min = overall_min.max(cmin);
                }
                _ => {
                    overall_max = overall_max.max(inline_max);
                    inline_max = 0;
                    // 子に明示の px 幅があれば寄与はその値（2026-09-26。flex 行の合計と同じ）。
                    let (cmin, cmax, explicit) = match parse_length_value(box_style_value(child, "width")) {
                        Some(LengthValue::Px(px)) => (px.max(0), px.max(0), true),
                        _ => {
                            let (a, b) = child.block_intrinsic_widths();
                            (a, b, false)
                        }
                    };
                    let (cmin, cmax) = clamp_contribution(child, cmin, cmax);
                    let edges = intrinsic_h_edges(child, explicit);
                    let (cmin, cmax) = (cmin + edges, cmax + edges);
                    overall_min = overall_min.max(cmin);
                    overall_max = overall_max.max(cmax);
                }
            }
        }
        overall_max = overall_max.max(inline_max);
        (overall_min.max(0), overall_max.max(overall_min).max(0))
    }

    fn inline_content_intrinsic_size(&self, available_width: i32) -> (i32, i32) {
        match &self.box_type {
            BoxType::InlineNode(node) | BoxType::InlineBlockNode(node) => {
                if let Some(size) = get_replaced_element_size_in(node, Some(available_width)) {
                    return size;
                }
                match &node.node.node_type {
                    NodeType::Text(text) => {
                        let font_size = node
                            .value("font-size")
                            .and_then(|v| parse_font_size_u32(&v))
                            .unwrap_or(16);
                        let line_height_val = node.value("line-height");
                        let line_height = parse_line_height(line_height_val, font_size);
                        let pre_wrap = matches!(
                            node.value("white-space").as_deref(),
                            Some("pre-wrap") | Some("pre-line")
                        );
                        let break_all = matches!(
                            node.value("word-break").as_deref(),
                            Some("break-all")
                        ) || matches!(
                            node.value("overflow-wrap").as_deref(),
                            Some("break-word")
                        );
                        // 描画側と同じ規則で空白を畳んでから測る（2026-09-26。
                        // 畳まずに測ると HTML の字下げの分だけ箱が広く・高くなる）。
                        let text = &crate::os_lib::layout::line_break::collapse_white_space(
                            text,
                            &node.value("white-space").unwrap_or_default(),
                        );
                        let (fam, bold) = text_font_of(node);
                        let (w, h) = crate::kernel::vector_font::get_vector_string_wrapped_size_family(
                            text,
                            font_size,
                            available_width.max(1) as u32,
                            0, // ls
                            0, // ws
                            break_all,
                            pre_wrap,
                            &fam,
                            bold,
                        );
                        let lines = h as i32 / (font_size as i32 + 4).max(1);
                        (w as i32, lines * line_height)
                    }
                    NodeType::Element { .. } => {
                        let mut max_line_w = 0i32;
                        let mut total_h = 0i32;
                        let mut current_line_w = 0i32;
                        let mut current_line_h = 0i32;
                        for child in &self.children {
                            if child.is_inline_line_break() {
                                if current_line_w > max_line_w {
                                    max_line_w = current_line_w;
                                }
                                total_h += current_line_h.max(20);
                                current_line_w = 0;
                                current_line_h = 0;
                                continue;
                            }
                            let (cw, ch) = child.intrinsic_inline_size(available_width.max(1));
                            if current_line_w > 0 && current_line_w + cw > available_width.max(1) {
                                if current_line_w > max_line_w {
                                    max_line_w = current_line_w;
                                }
                                total_h += current_line_h.max(20);
                                current_line_w = 0;
                                current_line_h = 0;
                            }
                            current_line_w += cw;
                            if ch > current_line_h {
                                current_line_h = ch;
                            }
                        }
                        if current_line_w > max_line_w {
                            max_line_w = current_line_w;
                        }
                        total_h += current_line_h.max(20);
                        if total_h == 0 {
                            let font_size = node
                                .value("font-size")
                                .and_then(|v| parse_font_size_u32(&v))
                                .unwrap_or(16);
                            return (8, (font_size as i32 + 4).max(12));
                        }
                        (max_line_w.max(1), total_h.max(1))
                    }
                }
            }
            _ => (0, 0),
        }
    }

    fn is_inline_line_break(&self) -> bool {
        match &self.box_type {
            BoxType::InlineNode(node) | BoxType::InlineBlockNode(node) => {
                matches!(&node.node.node_type, NodeType::Element { tag_name, .. } if tag_name == "br")
            }
            _ => false,
        }
    }

    fn apply_box_model_styles_with_base(&mut self, containing_width: i32) {
        // 【2026-09-26 バグ修正】従来は Block/InlineBlock 以外で即 return しており、
        // flex・grid・table コンテナの margin/padding/border が常に 0 だった
        // （`layout_flex`/`layout_grid`/`layout_table` は値が入る前提で計算している）。
        // 表の行・セルは表レイアウト側で余白を扱うため従来どおり対象外。
        let node = match &self.box_type {
            BoxType::BlockNode(n)
            | BoxType::InlineBlockNode(n)
            | BoxType::FlexNode(n)
            | BoxType::GridNode(n)
            | BoxType::TableNode(n) => n,
            _ => return,
        };
        let (m, p, b) = style_box_edges(node, containing_width, &self.dimensions);
        self.dimensions.margin = m;
        self.dimensions.padding = p;
        self.dimensions.border = b;
    }

    fn apply_box_model_styles(&mut self) {
        self.apply_box_model_styles_with_base(0);
    }
}