19. カスケードと詳細度 — 当たった宣言を (A,B,C) と出現順で並べ、最後が勝つ

// src/renderer/style.rs の compute_style と、UA 既定・詳細度の部分
pub fn compute_style(el: &Element, sheet: &StyleSheet, parent: Option<&ComputedStyle>) -> ComputedStyle {
    let mut style = ComputedStyle::default();

    if let Some(p) = parent {
        style.color = p.color;
        style.font_size = p.font_size;
        style.text_decoration = p.text_decoration;
    }

    apply_user_agent_defaults(&mut style, &el.tag);

    // (詳細度, 出現順, 宣言) を集めて安定ソートする
    let mut matched: Vec<((u32, u32, u32), usize, &Declaration)> = Vec::new();
    for (order, rule) in sheet.rules.iter().enumerate() {
        // セレクタリストの中で最も詳細度が高いものが、そのルールの詳細度
        let best = rule
            .selectors
            .iter()
            .filter(|s| s.matches(el))
            .map(|s| s.specificity())
            .max();
        if let Some(spec) = best {
            for d in &rule.declarations {
                matched.push((spec, order, d));
            }
        }
    }
    matched.sort_by_key(|(spec, order, _)| (*spec, *order));
    for (_, _, d) in matched {
        apply_declaration(&mut style, d);
    }
    style
}

fn apply_user_agent_defaults(style: &mut ComputedStyle, tag: &str) {
    style.display = match tag {
        "head" | "style" | "script" | "title" | "meta" | "link" => Display::None,
        "html" | "body" | "div" | "p" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "ul" | "ol" | "li" | "section"
        | "article" | "header" | "footer" | "nav" | "main" | "pre" | "blockquote" | "form" | "table" | "hr" => {
            Display::Block
        }
        _ => Display::Inline,
    };
    match tag {
        "h1" => style.font_size = 32.0, // 2em
        "h2" => style.font_size = 24.0, // 1.5em
        "h3" => style.font_size = 18.72, // 1.17em
        "a" => {
            style.color = Color::BLUE;
            style.text_decoration = TextDecoration::Underline;
        }
        _ => {}
    }
}

// src/css/cssom.rs のセレクタの一致と詳細度
impl Selector {
    /// 要素に一致するか
    pub fn matches(&self, el: &Element) -> bool {
        match self {
            Selector::Universal => true,
            Selector::Type(t) => el.tag == *t,
            Selector::Class(c) => el.classes().contains(&c.as_str()),
            Selector::Id(i) => el.id() == Some(i.as_str()),
            Selector::Unsupported(_) => false,
        }
    }

    /// 詳細度 (A, B, C)。Selectors Level 4 §17:
    /// A = ID セレクタの数、B = クラス・属性・擬似クラスの数、C = 型セレクタ・擬似要素の数。
    /// 比較は A → B → C の順(辞書順)。タプルの比較がそのまま仕様の比較になる
    pub fn specificity(&self) -> (u32, u32, u32) {
        match self {
            Selector::Id(_) => (1, 0, 0),
            Selector::Class(_) => (0, 1, 0),
            Selector::Type(_) => (0, 0, 1),
            Selector::Universal | Selector::Unsupported(_) => (0, 0, 0),
        }
    }

    pub fn to_css(&self) -> String {
        match self {
            Selector::Universal => "*".to_string(),
            Selector::Type(t) => t.clone(),
            Selector::Class(c) => format!(".{c}"),
            Selector::Id(i) => format!("#{i}"),
            Selector::Unsupported(s) => format!("{s} /* 未対応 */"),
        }
    }
}