atmos/os_lib/web_engine/

mod.rs

//! HTML パーサ・レイアウトエンジン・レンダラ（ブラウザエンジン本体）。
//!
//! [`WebEngine`] が HTML 文字列を受け取り、パース → CSS カスケード → レイアウト →
//! 描画までの一連のパイプラインを提供する。JavaScript 実行は [`crate::os_lib::js`] へ、
//! ネットワーク取得は [`crate::kernel::net_stack`] へ委譲する。
//!
//! アーキテクチャ詳細（コンポーネント構成・タブモデル・座標規約・テーブルレイアウト等）は
//! `spec/DESIGN.md` §3「ブラウザエンジン アーキテクチャ」を参照。
//!
//! 暴走ページ対策として [`MAX_RENDER_ELEMENTS`]（要素数上限）と [`MAX_HTML_BYTES`]
//! （HTML サイズ上限）で打ち切る。
// web_engine.rs - HTML Parser & Vector Font HTML Renderer Engine for AtmOS
#![allow(dead_code)]

use alloc::string::String;
use alloc::vec::Vec;
use spin::Mutex;

/// flatten 時に生成する RenderElement の上限。病的なページでのヒープ枯渇を防ぐ。
/// 1 要素あたり数百バイト程度なので、2 万要素でも十数 MB に収まる。
const MAX_RENDER_ELEMENTS: usize = 20000;
/// パース対象 HTML の上限バイト数。これを超える分は切り捨てる。
const MAX_HTML_BYTES: usize = 2 * 1024 * 1024;

/// ブラウザ内蔵のホームページ（OS 同梱 of 静的ページ）。
/// YouTubeへのリンクは、DNS解決フォールバックやYouTubeモック解除の修正に伴い、
/// ダミーURLではなく公式のYouTubeアドレスに設定されています。
pub const HOME_HTML: &str = r#"<html><title>AtmOS Browser</title><body style="background-color: #282a36; color: #f8f8f2;"><h1 style="color: #bd93f9;">AtmOS Browser</h1><p style="color: #f8f8f2;">アトモス（AtmOS）の内蔵ブラウザへようこそ。HTML/CSS パーサ・レイアウトエンジン・レンダラと JavaScript エンジンをすべて自前実装しています。</p><hr style="color: #44475a;"><h2 style="color: #8be9fd;">リンク</h2><div style="background-color: #1e1f29; color: #f8f8f2;"><p><a href="https://www.sugi-lab.net/">www.sugi-lab.net</a></p><p style="color: #6272a4;">Sugimura Lab の Web サイト。AtmOS の開発元です。研究・教育・各種プロジェクト of 情報を掲載しています。</p><p><a href="https://www.youtube.com/">YouTube を観る</a></p><p style="color: #6272a4;">YouTube の Web サイトを開きます。</p></div><h2 style="color: #8be9fd;">検索</h2><p><a href="https://lite.duckduckgo.com/lite/">DuckDuckGo で検索する</a></p><p style="color: #6272a4;">上のアドレスバーにキーワードを入力しても、そのまま DuckDuckGo で検索できます。</p><hr style="color: #44475a;"><p style="font-size: 12; color: #6272a4;">AtmOS — bare-metal OS on Raspberry Pi 3B+ / ARM64 + Rust</p></body></html>"#;

// ---------------------------------------------------------------------------
// ディスクキャッシュ (SylFS /cache/browser/<host>/<path_hash>)
// ---------------------------------------------------------------------------

// URL を SylFS のキャッシュパスへ変換する
mod cache;
pub(crate) mod draw_helpers;
pub(crate) mod helpers;
mod image;
mod layout;
mod render;
pub(crate) mod anim_budget;
pub(crate) mod css_units;
pub(crate) mod font_budget;
pub(crate) mod cache_path;
pub(crate) mod rel_path;
pub(crate) mod sticky;
pub(crate) mod fetch_limit;
pub(crate) mod queue_batch;
pub(crate) mod perf;
pub(crate) mod font_queue;
pub(crate) mod image_budget;
pub(crate) mod alpha_blend;
pub(crate) mod paint_order;
pub(crate) mod repaint_scope;
pub(crate) mod gradient_lut;
pub(crate) mod blur_box;
pub(crate) mod box_shadow;
pub(crate) mod osm_embed;
pub(crate) mod paint_cull;
pub(crate) mod url_resolve;
mod video;

pub use cache::clear_browser_cache;
pub use draw_helpers::{draw_border, draw_gradation};
// 自己テスト（`css/selftest.rs`）から`line-height`/`text-indent`の`%`/`em`
// 単位対応、`box-shadow`/`text-shadow`/`border-radius`の`rem`単位対応
// （いずれも2026-07-17）を直接検証するための再エクスポート。
pub(crate) use layout::{parse_line_height, parse_shadow_len_tok, resolve_border_radius, resolve_text_indent};
pub use helpers::{hash_str, url_encode};
pub use image::image_results_ready;
pub use image::shared_image;
pub use fetch_limit::set_draw_stage;

/// 取得待ちのフォント件数。再描画の判定から使う。
pub fn font_pending() -> usize {
    font_queue::pending_len()
}

// Bring submodule items into scope for use within this module
use cache::{cache_path_for, read_cache, write_cache};
use image::{enqueue_image, ImageFetchReq, IMAGE_QUEUE};
use video::stop_video_playback;

fn parse_url(url: &str) -> Option<(alloc::string::String, alloc::string::String)> {
    let rest = url.strip_prefix("http://")?;
    if let Some(slash_idx) = rest.find('/') {
        let (host, path) = rest.split_at(slash_idx);
        Some((
            alloc::string::String::from(host),
            alloc::string::String::from(path),
        ))
    } else {
        Some((
            alloc::string::String::from(rest),
            alloc::string::String::from("/"),
        ))
    }
}

/// 非印字キーの keycode を DOM の `KeyboardEvent.key` 風の名前に変換する。
fn key_name_for(keycode: u8) -> &'static str {
    match keycode {
        0x1C => "Enter",
        0x0E => "Backspace",
        0x0F => "Tab",
        0x01 => "Escape",
        0x39 => " ", // Space
        0x53 => "Delete",
        0x48 => "ArrowUp",
        0x50 => "ArrowDown",
        0x4B => "ArrowLeft",
        0x4D => "ArrowRight",
        0x47 => "Home",
        0x4F => "End",
        _ => "Unidentified",
    }
}

#[derive(Clone)]
struct AsyncLoadRequest {
    owner: u64, // 発行元エンジン(タブ)の一意 ID。結果は同じ owner だけが消費する
    is_https: bool,
    host: String,
    path: String,
    method: String,       // "GET" or "POST"
    body: Option<String>, // POST body (application/x-www-form-urlencoded)
    status: u8,           // 0: 空, 1: 処理中, 2: 成功, 3: 失敗
    result_body: Option<String>,
    result_dom: Option<crate::os_lib::dom::Node>,
    error_msg: Option<String>,
}

/// 全タブ共有の非同期ロードキュー。owner ID で各タブの結果を分離する。
struct AsyncLoadState {
    requests: Vec<AsyncLoadRequest>,
    thread_active: bool,
}

// ---------------------------------------------------------------------------
// 画像非同期ロードキュー
// ---------------------------------------------------------------------------

static SVG_BACK: &[u8] = b"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.5 16.5L6 10L12.5 3.5\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>";

static SVG_HOME: &[u8] = b"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10 2.5L3.5 8V16.5C3.5 17 4 17.5 4.5 17.5H7.5V12.5H12.5V17.5H15.5C16 17.5 16.5 17 16.5 16.5V8L10 2.5Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"round\"/></svg>";

static SVG_SHIELD_SECURE: &[u8] = b"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10 2.5C13 3.5 16.5 3.5 16.5 3.5V8.5C16.5 13 13 16.5 10 17.5C7 16.5 3.5 13 3.5 8.5V3.5C3.5 3.5 7 3.5 10 2.5Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"round\"/><path d=\"M7 10L9 12L13 8\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>";

static SVG_SHIELD_WARN: &[u8] = b"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M10 2.5C13 3.5 16.5 3.5 16.5 3.5V8.5C16.5 13 13 16.5 10 17.5C7 16.5 3.5 13 3.5 8.5V3.5C3.5 3.5 7 3.5 10 2.5Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"round\"/><path d=\"M4.5 4.5L15.5 15.5\" stroke=\"currentColor\" stroke-width=\"2\"/></svg>";

static SVG_SAVE: &[u8] = b"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M16 18H4C3 18 2 17 2 16V4C2 3 3 2 4 2H13L18 7V16C18 17 17 18 16 18Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M14 18V11H6V18\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M6 2V6H12\" stroke=\"currentColor\" stroke-width=\"2\"/></svg>";

static SVG_LOAD: &[u8] = b"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M18 16C18 17 17 18 16 18H4C3 18 2 17 2 16V4C2 3 3 2 4 2H8L10 4H16C17 4 18 5 18 6V16Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M2 8H18\" stroke=\"currentColor\" stroke-width=\"2\"/></svg>";

static SVG_WRAP: &[u8] = b"<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M3 5H17\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M3 10H13C15 10 16 11 16 13C16 15 15 16 13 16H11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M13 14L11 16L13 18\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M3 15H6\" stroke=\"currentColor\" stroke-width=\"2\"/></svg>";

static ASYNC_LOAD: Mutex<AsyncLoadState> = Mutex::new(AsyncLoadState {
    requests: Vec::new(),
    thread_active: false,
});
static NEXT_ENGINE_ID: spin::Mutex<u64> = spin::Mutex::new(1);

fn async_load_thread_entry() {
    loop {
        let req_opt = {
            let lock = ASYNC_LOAD.lock();
            // 処理中(status 1)のリクエストを1件複製して処理する
            lock.requests.iter().find(|r| r.status == 1).cloned()
        };

        let req = match req_opt {
            Some(r) => r,
            None => {
                // 処理待ちが無くなったらスレッド終了
                let mut lock = ASYNC_LOAD.lock();
                if !lock.requests.iter().any(|r| r.status == 1) {
                    lock.thread_active = false;
                    drop(lock);
                    // 【2026-08-05】メイン HTML の取得が終わったので、
                    // 止めていたリソース取得を再開させる（`fetch_limit` 参照）。
                    fetch_limit::set_main_load_in_flight(false);
                    crate::kernel::scheduler::exit();
                }
                fetch_limit::set_main_load_in_flight(false);
                continue;
            }
        };
        // 【2026-08-05】メイン HTML の取得中はリソース取得を新たに始めない。
        //
        // フォント 4 + 画像 4 で最大 8 本の TLS 接続を張れており、
        // この自作スタックは同時接続に弱い。CSS/JS も非同期化したときに
        // **メイン HTML が読み込めなくなった**（`[NET][STATS] total=3`）。
        // ページの他の何よりもメイン HTML が優先される
        // （それが無ければ描くものが無い）。
        fetch_limit::set_main_load_in_flight(true);

        {
            crate::warn!(
                "BROWSER_LOADER: thread started. is_https={}, host={}, path={}",
                req.is_https,
                req.host,
                req.path
            );

            let mut current_is_https = req.is_https;
            let mut current_host = req.host.clone();
            let mut current_path = req.path.clone();

            let is_post = req.method.eq_ignore_ascii_case("POST");
            let post_body = req.body.clone().unwrap_or_default();

            // --- POST は常にネットワーク（キャッシュしない） ---
            // --- GET: キャッシュチェック（デコード失敗時はネットワーク取得にフォールスルー）---
            let res = if !is_post {
                if let Some(cached) = read_cache(&current_host, &current_path) {
                    match alloc::string::String::from_utf8(cached) {
                        Ok(s) => {
                            crate::info!(
                                "BROWSER_LOADER: cache hit. host={}, path={}",
                                current_host,
                                current_path
                            );
                            Some(Ok(s))
                        }
                        Err(_) => {
                            // 壊れたキャッシュは削除してネットワーク取得
                            crate::warn!("[NET] BROWSER_LOADER: cache decode error, fetching from network. host={}", current_host);
                            let cp = cache_path_for(&current_host, &current_path);
                            let _fs_guard = crate::kernel::fs::FS_LOCK.lock();
                            let _ = crate::kernel::fs::get_fs().delete_file(&cp);
                            None
                        }
                    }
                } else {
                    None
                }
            } else {
                None
            };

            let res = if let Some(r) = res {
                r
            } else {
                // --- ネットワーク取得 ---
                // リンクが up していなければ即エラー
                if !crate::kernel::net::status().link_up {
                    crate::warn!("[NET] BROWSER_LOADER: network link is down");
                    Err(String::from("Network link is down. Check QEMU network settings or USB-Ethernet adapter."))
                } else {
                    let stack = crate::kernel::net_stack::TcpIpStack::new();

                    // POST の場合は1回だけ送信（リダイレクトは GET に変換）
                    if is_post {
                        crate::info!(
                            "BROWSER_LOADER: POST {} host={}, path={}",
                            if current_is_https { "HTTPS" } else { "HTTP" },
                            current_host,
                            current_path
                        );
                        match stack.web_post(
                            current_is_https,
                            &current_host,
                            &current_path,
                            "application/x-www-form-urlencoded",
                            post_body.as_bytes(),
                        ) {
                            Ok(r) => {
                                // 303 See Other は GET でリダイレクト
                                if r.status_code == 303
                                    || r.status_code == 301
                                    || r.status_code == 302
                                {
                                    if let Some(loc) = r.headers.get("location") {
                                        let loc_str = loc.as_str();
                                        if let Some(no_proto) = loc_str.strip_prefix("https://") {
                                            current_is_https = true;
                                            if let Some(idx) = no_proto.find('/') {
                                                let (h, p) = no_proto.split_at(idx);
                                                current_host = String::from(h);
                                                current_path = String::from(p);
                                            } else {
                                                current_host = String::from(no_proto);
                                                current_path = String::from("/");
                                            }
                                        } else if let Some(no_proto) =
                                            loc_str.strip_prefix("http://")
                                        {
                                            current_is_https = false;
                                            if let Some(idx) = no_proto.find('/') {
                                                let (h, p) = no_proto.split_at(idx);
                                                current_host = String::from(h);
                                                current_path = String::from(p);
                                            } else {
                                                current_host = String::from(no_proto);
                                                current_path = String::from("/");
                                            }
                                        } else if loc_str.starts_with('/') {
                                            current_path = String::from(loc_str);
                                        }
                                        // GET でリダイレクト先を取得
                                        match stack.web_get(
                                            current_is_https,
                                            &current_host,
                                            &current_path,
                                        ) {
                                            Ok(r2) => {
                                                write_cache(
                                                    &current_host,
                                                    &current_path,
                                                    r2.body.as_bytes(),
                                                );
                                                Ok(r2.body)
                                            }
                                            Err(e) => Err(String::from(e.message)),
                                        }
                                    } else {
                                        Ok(r.body)
                                    }
                                } else {
                                    Ok(r.body)
                                }
                            }
                            Err(e) => Err(String::from(e.message)),
                        }
                    } else {
                        let mut final_res = None;
                        // 【2026-07-26】従来はネットワークエラーが1回起きた時点で
                        // 即座に失敗確定にしていた。この自作TCP/TLSスタックは
                        // 実測でパケット消失・タイムアウトが頻発しており
                        // （詳細は spec/TODO.md）、メインHTMLの取得が1回失敗する
                        // だけでページ全体が表示されない。外部CSS取得側
                        // (`https_get_binary`) は既に最大3回の再試行を持つのに、
                        // 最も重要なメインHTMLだけが再試行なしだった。
                        // リダイレクト追従とは別枠で再試行回数を確保する。
                        let mut fetch_retries = 2u32;
                        for _ in 0..6 {
                            // リダイレクト追従（最大3回）＋ 取得失敗時の再試行
                            match stack.web_get(current_is_https, &current_host, &current_path) {
                                Ok(r) => {
                                    let code = r.status_code;
                                    if code == 301
                                        || code == 302
                                        || code == 303
                                        || code == 307
                                        || code == 308
                                    {
                                        if let Some(loc) = r.headers.get("location") {
                                            crate::info!("[NET] BROWSER_LOADER: Redirect to {}", loc);
                                            let loc_str = loc.as_str();
                                            if let Some(no_proto) = loc_str.strip_prefix("http://")
                                            {
                                                current_is_https = false;
                                                if let Some(idx) = no_proto.find('/') {
                                                    let (h, p) = no_proto.split_at(idx);
                                                    current_host = String::from(h);
                                                    current_path = String::from(p);
                                                } else {
                                                    current_host = String::from(no_proto);
                                                    current_path = String::from("/");
                                                }
                                                continue;
                                            } else if let Some(no_proto) =
                                                loc_str.strip_prefix("https://")
                                            {
                                                current_is_https = true;
                                                if let Some(idx) = no_proto.find('/') {
                                                    let (h, p) = no_proto.split_at(idx);
                                                    current_host = String::from(h);
                                                    current_path = String::from(p);
                                                } else {
                                                    current_host = String::from(no_proto);
                                                    current_path = String::from("/");
                                                }
                                                continue;
                                            } else if loc_str.starts_with('/') {
                                                current_path = String::from(loc_str);
                                                continue;
                                            }
                                        }
                                    }
                                    // キャッシュに保存
                                    write_cache(&current_host, &current_path, r.body.as_bytes());
                                    final_res = Some(Ok(r.body));
                                    break;
                                }
                                Err(e) => {
                                    if fetch_retries > 0 {
                                        fetch_retries -= 1;
                                        crate::warn!(
                                            "[NET] BROWSER_LOADER: fetch failed ({}), retrying ({} left) host={} path={}",
                                            e.message,
                                            fetch_retries,
                                            current_host,
                                            current_path
                                        );
                                        continue;
                                    }
                                    final_res = Some(Err(String::from(e.message)));
                                    break;
                                }
                            }
                        }
                        final_res.unwrap_or_else(|| Err(String::from("Too many redirects")))
                    } // end GET block
                } // end link_up check
            }; // end res

            crate::warn!("[NET][DIAG] async_load: res computed, about to lock ASYNC_LOAD");
            let mut lock = ASYNC_LOAD.lock();
            crate::warn!("[NET][DIAG] async_load: ASYNC_LOAD locked");
            // owner が一致し、まだ処理中(status 1)のリクエストへ結果を書き戻す。
            // （処理中に同じタブが再ロードした場合は古いリクエストが置換されているため、
            //   status==1 のものだけを対象にすることで取り違えを防ぐ）
            if let Some(current_req) = lock
                .requests
                .iter_mut()
                .find(|r| r.owner == req.owner && r.status == 1)
            {
                match res {
                    Ok(body) => {
                        crate::info!("[NET] BROWSER_LOADER: load done. size={}", body.len());
                        let dom_tree = crate::os_lib::dom::parse_html(&body);
                        current_req.status = 2; // 成功
                        current_req.result_body = Some(body);
                        current_req.result_dom = Some(dom_tree);
                    }
                    Err(e) => {
                        crate::warn!("[NET] BROWSER_LOADER: load failed. err=[{}] len={}", e, e.len());
                        current_req.status = 3; // 失敗
                        current_req.error_msg = Some(e);
                    }
                }
            }
        }
    } // loop
}

/// CSS `border-style` の値。RenderElement は要素あたり最大 5 個（全体 + 4辺）保持するため、
/// String（24バイト）ではなく 1 バイトの enum にしてメモリを節約する。
#[derive(Clone, Copy, PartialEq, Eq, Debug, Default)]
pub enum BorderStyle {
    #[default]
    None,
    Solid,
    Dashed,
    Dotted,
    Double,
}

impl BorderStyle {
    pub fn as_str(self) -> &'static str {
        match self {
            BorderStyle::None => "none",
            BorderStyle::Solid => "solid",
            BorderStyle::Dashed => "dashed",
            BorderStyle::Dotted => "dotted",
            BorderStyle::Double => "double",
        }
    }

    pub fn parse(s: &str) -> Self {
        match s.trim().to_ascii_lowercase().as_str() {
            "solid" => BorderStyle::Solid,
            "dashed" => BorderStyle::Dashed,
            "dotted" => BorderStyle::Dotted,
            "double" => BorderStyle::Double,
            _ => BorderStyle::None,
        }
    }

    pub fn is_none(self) -> bool {
        matches!(self, BorderStyle::None)
    }
}

/// CSS `list-style-type` の値。同じ理由で String の代わりに enum を使う。
#[derive(Clone, Copy, PartialEq, Eq, Debug, Default)]
pub enum ListStyleType {
    /// 未指定（コンテキストに応じたデフォルトマーカーを使う）
    #[default]
    Unset,
    None,
    Disc,
    Circle,
    Square,
    Decimal,
    UpperAlpha,
    LowerAlpha,
    UpperRoman,
    LowerRoman,
}

impl ListStyleType {
    pub fn parse(s: &str) -> Self {
        match s.trim().to_ascii_lowercase().as_str() {
            "none" => ListStyleType::None,
            "disc" => ListStyleType::Disc,
            "circle" => ListStyleType::Circle,
            "square" => ListStyleType::Square,
            "decimal" => ListStyleType::Decimal,
            "upper-alpha" | "upper-latin" => ListStyleType::UpperAlpha,
            "lower-alpha" | "lower-latin" => ListStyleType::LowerAlpha,
            "upper-roman" => ListStyleType::UpperRoman,
            "lower-roman" => ListStyleType::LowerRoman,
            _ => ListStyleType::Unset,
        }
    }
}

/// 1始まりの序数を A, B, ... Z, AA, AB, ... の26進表記に変換する（`upper-alpha`/`lower-alpha`）。
pub fn number_to_alpha(mut n: u32, upper: bool) -> alloc::string::String {
    if n == 0 {
        n = 1;
    }
    let mut letters = alloc::vec::Vec::new();
    while n > 0 {
        let rem = ((n - 1) % 26) as u8;
        let base = if upper { b'A' } else { b'a' };
        letters.push((base + rem) as char);
        n = (n - 1) / 26;
    }
    letters.iter().rev().collect()
}

/// 1〜3999 の序数をローマ数字表記に変換する（`upper-roman`/`lower-roman`）。範囲外は十進数にフォールバック。
pub fn number_to_roman(n: u32, upper: bool) -> alloc::string::String {
    if n == 0 || n > 3999 {
        return alloc::format!("{}", n);
    }
    const VALUES: &[(u32, &str)] = &[
        (1000, "M"), (900, "CM"), (500, "D"), (400, "CD"),
        (100, "C"), (90, "XC"), (50, "L"), (40, "XL"),
        (10, "X"), (9, "IX"), (5, "V"), (4, "IV"), (1, "I"),
    ];
    let mut remaining = n;
    let mut out = alloc::string::String::new();
    for (value, symbol) in VALUES {
        while remaining >= *value {
            out.push_str(symbol);
            remaining -= value;
        }
    }
    if upper {
        out
    } else {
        out.to_ascii_lowercase()
    }
}

/// CSS `background-size` の1軸ぶんの値。
#[derive(Clone, Copy, PartialEq, Debug)]
pub enum BgSizeVal {
    Auto,
    Px(i32),
    Percent(f32),
}

/// CSS `background-size` のモード。
#[derive(Clone, Copy, PartialEq, Debug, Default)]
pub enum BgSizeMode {
    /// 未指定時の既定挙動（このエンジンの互換維持のため box 全面に引き伸ばす）。
    #[default]
    Stretch,
    Cover,
    Contain,
    Explicit(BgSizeVal, BgSizeVal),
}

/// CSS `background-repeat` の1軸ぶんのモード。
#[derive(Clone, Copy, PartialEq, Debug, Default)]
pub enum BgRepeatMode {
    #[default]
    Repeat,
    NoRepeat,
    /// タイルを等間隔に敷き詰め、余った分は境界を切らずタイル間の隙間として配分する。
    Space,
    /// タイルの寸法をこの軸に整数個ちょうど収まるよう拡縮する。
    Round,
}

/// CSS `object-fit`（<img> 要素の内容フィッティング）。
#[derive(Clone, Copy, PartialEq, Debug, Default)]
pub enum ObjectFit {
    /// 既定値。box 全面へ引き伸ばす（従来互換）。
    #[default]
    Fill,
    Contain,
    Cover,
    /// スケーリングせず原寸のまま配置。
    None,
    /// contain と none の小さい方（画像を原寸より拡大しない）。
    ScaleDown,
}

// 描画されるフラットなレイアウト要素
#[derive(Debug, Clone, PartialEq)]
pub struct GradientStop {
    pub color: u32,
    pub position: f32, // 0.0 ~ 1.0
}

#[derive(Debug, Clone, PartialEq)]
pub struct LinearGradient {
    pub angle_deg: f32,
    pub stops: alloc::vec::Vec<GradientStop>,
}

#[derive(Debug, Clone, PartialEq)]
pub enum RadialShape {
    Circle,
    Ellipse,
}

#[derive(Debug, Clone, PartialEq)]
pub struct RadialGradient {
    pub shape: RadialShape,
    pub pos_x: f32, // 0.0 ~ 1.0
    pub pos_y: f32, // 0.0 ~ 1.0
    pub stops: alloc::vec::Vec<GradientStop>,
}

#[derive(Debug, Clone, PartialEq)]
pub enum CssFilter {
    Blur(i32), // radius in px
    HueRotate(f32), // angle in degrees
    DropShadow(i32, i32, i32, u32), // ox, oy, blur, color
}

#[derive(Debug, Clone, PartialEq)]
pub struct RenderElement {
    pub text: String,
    pub font_size: u32,
    pub color: u32,
    pub bg_color: Option<u32>, // 背景色の追加
    pub hover_bg_color: Option<u32>,
    pub hover_color: Option<u32>,
    pub hover_border_color: Option<u32>,
    /// :focus 時の算出値差分（hover 系と同じ仕組み。実際の適用可否は
    /// 描画側で focused_id と element_id の一致を見て選ぶ）。
    pub focus_bg_color: Option<u32>,
    pub focus_color: Option<u32>,
    pub focus_border_color: Option<u32>,
    /// :active 時の算出値差分（hover/focus 系と同じ仕組み。実際の適用可否は
    /// 描画側で「ホバー中 かつ マウス左ボタン押下中」を見て選ぶ）。
    pub active_bg_color: Option<u32>,
    pub active_color: Option<u32>,
    pub active_border_color: Option<u32>,
    /// `::marker{color:...}` による箇条書き/番号マーカーの色上書き（無指定なら `color` を継承）。
    pub marker_color: Option<u32>,
    /// `::marker{font-size:...}` によるマーカーのフォントサイズ上書き（無指定なら周囲のサイズを継承）。
    pub marker_font_size: Option<u32>,
    /// `::marker{content:...}` によるマーカー文字列そのものの上書き（無指定なら
    /// `list-style-type` から導出した既定の記号/番号を使う）。
    pub marker_content: Option<alloc::string::String>,
    pub border_color: Option<u32>,
    pub border_style: BorderStyle,
    pub font_bold: bool,    // font-weight: bold
    pub font_italic: bool,  // font-style: italic
    pub underline: bool,    // text-decoration: underline
    pub line_through: bool, // text-decoration: line-through
    pub overline: bool,     // text-decoration: overline
    /// text-decoration-color（未指定なら文字色を使う）。
    pub decoration_color: Option<u32>,
    /// text-decoration-style（solid/dotted/dashed/wavy/double、既定 solid）。
    pub decoration_style: String,
    /// text-decoration-thickness（px。`auto`/未指定は1px相当）。
    pub decoration_thickness: i32,
    /// text-underline-offset（px。underline のみに適用、0/負値も可。`auto`/未指定は0）。
    pub decoration_underline_offset: i32,
    /// `scroll-margin-top`（px。アンカー/フラグメントナビゲーションのスクロール位置から
    /// この分だけ引く。固定ヘッダーの下にターゲットが隠れないようにする用途）。
    pub scroll_margin_top: i32,
    pub client_insets: Option<(i32, i32, i32, i32)>, // (top, right, bottom, left) in px
    /// `caret-color`（テキスト入力のキャレット色。未指定なら IME 状態に応じた既定色を使う）。
    pub caret_color: Option<u32>,
    /// `accent-color`（checkbox/radio のチェック時の塗り色。未指定ならテーマ既定色を使う）。
    pub accent_color: Option<u32>,
    /// `::placeholder{color:...}`（合成プロパティ `x-placeholder-color` 経由）。
    /// 未指定ならテーマの薄色（`editor_dim_fg`）を使う。
    pub placeholder_color: Option<u32>,
    /// `<input>`/`<textarea>` の `placeholder` 属性（値が空のときだけ薄色で表示する）。
    pub placeholder: String,
    pub is_video: bool,     // 動画要素フラグ
    pub video_src: String,  // 動画ソースURL
    pub is_iframe: bool,    // iframe 要素フラグ
    pub iframe_src: String, // iframe の src URL
    pub is_link: bool,
    /// `pointer-events:none` — true ならこの要素はクリック/ホバー判定の対象から除外する
    /// （リンク登録をスキップする簡略実装。子孫への `pointer-events:auto` による
    /// 個別復元は非対応）。
    pub pointer_events_none: bool,
    pub href: String,
    pub is_hr: bool,
    pub is_img: bool,
    /// `<img loading="lazy">`。これだけは画面に入ってから取得する（2026-09-26）。
    pub img_lazy: bool,
    pub img_alt: String,
    /// `<canvas>` の 2D コンテキスト id（`os_lib/canvas2d` の registry）。
    ///
    /// JS が描いた内容はその registry の `Surface` にあり、ここに id が
    /// 入っていれば描画時に要素の矩形へ転送する。`None` なら canvas 以外か、
    /// まだ `getContext("2d")` が呼ばれていない。
    pub canvas_ctx_id: Option<u32>,
    /// `aspect-ratio`（CSS Box Sizing Level 4。幅と高さの比率 `width / height`）。
    pub aspect_ratio: Option<f32>,
    pub is_input: bool,
    pub is_textarea: bool,
    pub is_button: bool,
    /// type=reset のボタンか。クリックで所属 form を初期値へ戻す（送信しない）。
    pub is_reset: bool,
    /// 入力種別: 0=テキスト, 1=checkbox, 2=radio, 3=select。
    /// checkbox/radio/select は is_input=false（テキスト編集対象ではない）として扱い、
    /// クリックでトグル/循環し change イベントを発火する。
    pub input_kind: u8,
    /// radio のグループ名（name 属性）。同一グループ内で1つだけ checked になる。
    pub radio_group: String,
    /// radio/checkbox の value 属性（送信値・radio選択値）。
    pub input_value: String,
    /// select の選択肢 (value, ラベル) 一覧。input_kind==3 のときのみ有効。
    pub select_options: alloc::vec::Vec<(String, String)>,
    /// <label> 要素の関連付け先。for 属性の値、または内包 input の id。
    /// 非空なら、この要素クリックで該当 input をトグル/フォーカスする。
    pub label_for: String,
    pub button_icon: u8, // 0: なし, 1: Save, 2: Load, 3: Wrap
    pub element_id: String,
    pub onclick: String,
    pub form_action: String,
    pub form_method: String,
    pub width: i32,
    pub x_offset: i32, // コンテンツ全体でのX相対座標 (px)
    pub y_offset: i32, // コンテンツ全体でのY相対座標 (px)
    pub height: i32,
    pub border_radius: (i32, i32, i32, i32), // (tl, tr, br, bl)
    pub is_li: bool,
    pub li_num: Option<u32>,
    pub list_style_type: ListStyleType,
    /// list-style-position: inside なら true（マーカーを content 内で本文の直前に描画）。
    pub list_style_inside: bool,
    /// `list-style-image: url(...)`（`list-style` ショートハンド内の url() も含む）で
    /// 解決された画像パス。空文字なら未指定（従来通り list_style_type のグリフを使う）。
    pub list_style_image: String,
    pub is_blockquote: bool,
    pub border_top_width: i32,
    pub border_right_width: i32,
    pub border_bottom_width: i32,
    pub border_left_width: i32,
    pub border_top_color: Option<u32>,
    pub border_right_color: Option<u32>,
    pub border_bottom_color: Option<u32>,
    pub border_left_color: Option<u32>,
    pub border_top_style: BorderStyle,
    pub border_right_style: BorderStyle,
    pub border_bottom_style: BorderStyle,
    pub border_left_style: BorderStyle,
    pub padding_top: i32,
    pub padding_right: i32,
    pub padding_bottom: i32,
    pub padding_left: i32,
    /// `background-clip`/`background-origin`（`"border-box"`/`"padding-box"`/`"content-box"`）。
    /// `background-clip: text` は非対応で `border-box` にフォールバック。
    pub bg_clip: String,
    pub bg_origin: String,
    /// `background-attachment`（`"scroll"`(既定)/`"fixed"`）。`local` は `scroll` と同一視する。
    pub bg_attachment: String,
    pub bg_image: Option<String>,
    /// `background-image: url(a), url(b)` のような複数レイヤー全体（`bg_image` は先頭と同じ値）。
    /// 全レイヤーが同じ position/size/repeat を共有する簡略実装（レイヤーごとの個別指定は非対応）。
    pub bg_images: Vec<String>,
    /// `background-blend-mode`（`background-image` を `background-color` に対して
    /// 合成する際のブレンドモード。`mix-blend-mode` と同じ `blend_pixel` を再利用する）。
    /// 空文字列/`"normal"` は通常のアルファ合成。
    pub background_blend_mode: String,
    /// 複数レイヤー（`bg_images.len() > 1`）向けの、レイヤーごとの
    /// (size, repeat_x, repeat_y, pos_x, pos_y)。単一レイヤーの場合は空（`bg_size`/
    /// `bg_repeat_*`/`bg_pos_*` をそのまま使う）。
    pub bg_layers: alloc::vec::Vec<(BgSizeMode, BgRepeatMode, BgRepeatMode, f32, f32)>,
    // --- New CSS feature fields ---
    pub pos_top: Option<i32>,
    pub pos_left: Option<i32>,
    pub pos_right: Option<i32>,
    pub pos_bottom: Option<i32>,
    pub z_index: i32,
    /// DOM ツリー上の深さ。描画ソートの第 2 キー。
    /// 要素列は祖先が先に積まれるとは限らないため、同一 z 内で祖先（浅い方）を
    /// 先に描くにはこれが要る（`spec/paint_order.md` の不変条件 I-1）。
    pub paint_depth: u32,
    pub is_fixed: bool,
    pub overflow_hidden: bool,
    pub clip_x0: i32,
    pub clip_y0: i32,
    pub clip_x1: i32,
    pub clip_y1: i32,
    /// box-shadow: カンマ区切りの複数シャドウに対応（各要素は (offset_x, offset_y, blur, color, is_inset)）。
    /// 空 Vec = 未指定。CSSの重なり順（先頭が最前面）どおり Vec の先頭から順に並ぶ。
    pub box_shadow: alloc::vec::Vec<(i32, i32, i32, u32, bool)>,
    pub white_space_nowrap: bool,
    pub text_overflow_ellipsis: bool,
    /// `direction:rtl` かどうか。`text-overflow:ellipsis` の省略記号を先頭側に出し、
    /// 末尾ではなく先頭側の文字を切り詰める（CSS仕様どおりの挙動）ために使う。
    pub text_overflow_rtl: bool,
    pub linear_gradient: Option<LinearGradient>,
    pub radial_gradient: Option<RadialGradient>,
    /// `conic-gradient(c1, c2, ...)` の全カラーストップ（12時方向から時計回り、等間隔配置）。
    /// 以前は先頭2色のみを保持する `(u32, u32)` で、3色目以降が丸ごと失われるバグがあった。
    pub conic_gradient: Option<alloc::vec::Vec<GradientStop>>,
    /// (全カラーストップ, cycle_px, is_vertical)。以前は先頭2色固定の `(u32,u32,i32,bool)`
    /// で3色目以降が失われていた。周期内で全色を均等割りして補間する。
    pub repeating_linear_gradient: Option<(alloc::vec::Vec<u32>, i32, bool)>,
    /// (全カラーストップ, cycle_px)。以前は先頭2色固定の `(u32,u32,i32)` で
    /// 3色目以降が失われていた。
    pub repeating_radial_gradient: Option<(alloc::vec::Vec<u32>, i32)>,
    pub opacity: u8,                               // 0=transparent, 255=opaque
    pub visibility_hidden: bool,
    /// text-shadow: カンマ区切りの複数シャドウに対応（各要素は (offset_x, offset_y, blur, color)）。
    /// 空 Vec = 未指定。CSSの重なり順（先頭が最前面）どおり Vec の先頭から順に並ぶ。
    pub text_shadow: alloc::vec::Vec<(i32, i32, i32, u32)>,
    /// ::before / ::after content string (empty = no pseudo element)
    pub before_content: String,
    pub after_content: String,
    /// `::before { font-family: "Font Awesome 6 Free"; }` 等、疑似要素専用の
    /// `font-family`（空 = 指定なし = 通常のグローバルフォントで描画）。
    /// FontAwesome等のアイコンフォントは複数ファミリーが同じprivate-use-area
    /// コードポイントに異なるグリフを割り当てるため、要素の`content`が
    /// アイコン専用（`el.text`が空でicon用の`before_content`のみ）の場合に限り、
    /// このファミリー名で登録済みカスタムフォントを優先的に探して描画する。
    /// 【2026-08-03】要素自身の `font-family`（カンマ区切りのまま保持）。
    ///
    /// `@font-face` で登録した Web フォントを字形へ反映するには、
    /// 描画時にどの family を使うかが要る。従来は `::before` 用の
    /// `before_font_family` しか持っておらず、**本文の family がどこにも
    /// 渡っていなかった**ため、フォントを取得・登録しても反映されなかった。
    pub font_family: String,
    pub before_font_family: String,
    /// CSS transform: translate(x,y) / scale(sx,sy) / rotate(deg) の簡易表現
    pub transform_tx: i32, // translateX px
    pub transform_ty: i32,         // translateY px
    pub transform_scale_x: f32,    // X軸 scale factor (1.0 = no scale)。scale()/scaleX() で設定
    pub transform_scale_y: f32,    // Y軸 scale factor (1.0 = no scale)。scale()/scaleY() で設定
    pub transform_rotate_deg: f32, // rotate degrees
    /// transform: skewX(deg) せん断変換のX軸角度（度。既定 0.0 = 変換なし）。
    pub transform_skew_x: f32,
    /// transform: skewY(deg) せん断変換のY軸角度（度。既定 0.0 = 変換なし）。
    pub transform_skew_y: f32,
    /// transform-origin（scale の基準点。0.0-1.0 の割合、既定は (0.5,0.5)=中央）。
    pub transform_origin_x: f32,
    pub transform_origin_y: f32,
    /// letter-spacing（文字間に加える px、負も可）。0 = normal。
    pub letter_spacing: i32,
    /// word-spacing（半角スペース1文字ごとに加える px、負も可）。0 = normal。
    pub word_spacing: i32,
    /// text-emphasis-style: 各文字の上に付す強調記号（"dot"/"circle"/"double-circle"/
    /// "triangle"/"sesame"、またはクォート付きカスタム1文字、"none"/空文字列 = 無し）。
    /// `text-emphasis-position` は非対応で常に文字の上（横書き前提）に描く。
    pub text_emphasis_style: String,
    /// text-emphasis-color（未指定なら文字色 `color` を使う）。
    pub text_emphasis_color: Option<u32>,
    /// CSS `cursor`。`"text"` のみ実際のマウスカーソル形状（I-beam）へ反映する。
    /// それ以外の非対応キーワード（`pointer`/`wait`/`help` 等）は既定の矢印にフォールバックする。
    pub cursor_style: String,
    /// このエレメントが所属するスクロールコンテナの element_id（空 = ページスクロール）。
    pub scroll_container_id: String,
    /// CSS clip-path value (e.g. "circle(50%)", empty = no clip)
    pub clip_path: String,
    /// position: sticky
    pub is_sticky: bool,
    /// sticky の吸着オフセット（top/bottom）。両方指定時は top を優先する。
    pub sticky_top: Option<i32>,
    pub sticky_bottom: Option<i32>,
    /// sticky の可動範囲下限（吸着後にこれ以上下げない、含む要素の下端 - height）。
    /// 未設定時（属するコンテナが無い等）は i32::MAX として無制限に振る舞う。
    pub sticky_bound_max_y: i32,
    /// background-size（既定は Stretch = box 全面に引き伸ばし、従来互換）。
    pub bg_size: BgSizeMode,
    /// background-repeat: x/y 各軸のモード（Stretch モードでは効果なし）。
    pub bg_repeat_x: BgRepeatMode,
    pub bg_repeat_y: BgRepeatMode,
    /// background-position のアンカー位置（0.0=左/上, 1.0=右/下, 0.5=中央）。
    pub bg_pos_x: f32,
    pub bg_pos_y: f32,
    /// outline（レイアウトに影響しない装飾線。border-box の外側に描画）。
    pub outline_color: Option<u32>,
    pub outline_width: i32,
    /// outline-offset（border-box からの追加オフセット px）。
    pub outline_offset: i32,
    /// outline-style（"solid"/"dashed"/"dotted"、既定 "solid"）。
    pub outline_style: String,
    /// <img> 要素の object-fit / object-position。
    pub object_fit: ObjectFit,
    /// 既定は (0.5, 0.5)（中央）。background-position とは既定値が異なる点に注意。
    pub object_pos_x: f32,
    pub object_pos_y: f32,
    /// CSS `filter`（生の宣言値、例 "grayscale(1) brightness(1.2)"）。
    /// <img> のピクセル描画時にのみ適用する簡略実装（grayscale/brightness/invert/sepia/contrast/saturate のみ対応）。
    pub filter: String,
    /// CSS `mix-blend-mode`（生の宣言値）。単色背景の塗り（クリップ無し・不透明・角丸無しの
    /// 最も単純な経路）にのみ適用する簡略実装。multiply/screen/darken/lighten/difference のみ対応。
    pub mix_blend_mode: String,
    /// CSS `backdrop-filter`（生の宣言値）。
    pub backdrop_filter: String,
    /// CSS `image-rendering`（"pixelated", "crisp-edges", "smooth" 等）。
    pub image_rendering: String,
    /// CSS `text-stroke` / `-webkit-text-stroke`（幅と色）。
    pub text_stroke_width: i32,
    pub text_stroke_color: Option<u32>,
    /// `-webkit-line-clamp`（複数行テキストの末尾を `...` で省略表示する行数上限。
    /// 0 = 無制限。`display: -webkit-box` かつ `-webkit-box-orient: vertical` と
    /// 併用されるが、この実装では値が 0 でなければ常に有効にする簡略実装）。
    pub line_clamp: i32,
    pub node_idx: Option<usize>,
}

impl Default for RenderElement {
    fn default() -> Self {
        RenderElement {
            node_idx: None,
            text: String::new(),
            font_size: 0,
            color: 0,
            bg_color: None,
            hover_bg_color: None,
            hover_color: None,
            hover_border_color: None,
            focus_bg_color: None,
            focus_color: None,
            focus_border_color: None,
            active_bg_color: None,
            active_color: None,
            active_border_color: None,
            marker_color: None,
            marker_font_size: None,
            marker_content: None,
            border_color: None,
            client_insets: None,
            border_style: BorderStyle::None,
            font_bold: false,
            font_italic: false,
            underline: false,
            line_through: false,
            overline: false,
            decoration_color: None,
            decoration_style: String::new(),
            decoration_thickness: 1,
            decoration_underline_offset: 0,
            scroll_margin_top: 0,
            caret_color: None,
            accent_color: None,
            placeholder_color: None,
            placeholder: String::new(),
            is_video: false,
            video_src: String::new(),
            is_iframe: false,
            iframe_src: String::new(),
            is_link: false,
            pointer_events_none: false,
            href: String::new(),
            is_hr: false,
            is_img: false,
            img_lazy: false,
            canvas_ctx_id: None,
            img_alt: String::new(),
            aspect_ratio: None,
            is_input: false,
            is_textarea: false,
            is_button: false,
            is_reset: false,
            input_kind: 0,
            radio_group: String::new(),
            input_value: String::new(),
            select_options: alloc::vec::Vec::new(),
            label_for: String::new(),
            button_icon: 0,
            element_id: String::new(),
            onclick: String::new(),
            form_action: String::new(),
            form_method: String::new(),
            width: 0,
            x_offset: 0,
            y_offset: 0,
            height: 0,
            border_radius: (0, 0, 0, 0),
            is_li: false,
            li_num: None,
            list_style_type: ListStyleType::Unset,
            list_style_inside: false,
            list_style_image: String::new(),
            is_blockquote: false,
            border_top_width: 0,
            border_right_width: 0,
            border_bottom_width: 0,
            border_left_width: 0,
            border_top_color: None,
            border_right_color: None,
            border_bottom_color: None,
            border_left_color: None,
            border_top_style: BorderStyle::None,
            border_right_style: BorderStyle::None,
            border_bottom_style: BorderStyle::None,
            border_left_style: BorderStyle::None,
            padding_top: 0,
            padding_right: 0,
            padding_bottom: 0,
            padding_left: 0,
            bg_clip: String::from("border-box"),
            bg_origin: String::from("padding-box"),
            bg_attachment: String::from("scroll"),
            bg_image: None,
            bg_images: Vec::new(),
            background_blend_mode: String::new(),
            bg_layers: alloc::vec::Vec::new(),
            pos_top: None,
            pos_left: None,
            pos_right: None,
            pos_bottom: None,
            z_index: 0,
            paint_depth: 0,
            is_fixed: false,
            overflow_hidden: false,
            clip_x0: 0,
            clip_y0: 0,
            clip_x1: i32::MAX,
            clip_y1: i32::MAX,
            box_shadow: alloc::vec::Vec::new(),
            white_space_nowrap: false,
            text_overflow_ellipsis: false,
            text_overflow_rtl: false,
            linear_gradient: None,
            radial_gradient: None,
            conic_gradient: None,
            repeating_linear_gradient: None,
            repeating_radial_gradient: None,
            opacity: 255,
            visibility_hidden: false,
            text_shadow: alloc::vec::Vec::new(),
            before_content: String::new(),
            after_content: String::new(),
            font_family: String::new(),
            before_font_family: String::new(),
            transform_tx: 0,
            transform_ty: 0,
            transform_scale_x: 1.0,
            transform_scale_y: 1.0,
            transform_rotate_deg: 0.0,
            transform_skew_x: 0.0,
            transform_skew_y: 0.0,
            transform_origin_x: 0.5,
            transform_origin_y: 0.5,
            letter_spacing: 0,
            word_spacing: 0,
            text_emphasis_style: String::new(),
            text_emphasis_color: None,
            cursor_style: String::new(),
            scroll_container_id: String::new(),
            clip_path: String::new(),
            is_sticky: false,
            sticky_top: None,
            sticky_bottom: None,
            sticky_bound_max_y: i32::MAX,
            bg_size: BgSizeMode::Stretch,
            bg_repeat_x: BgRepeatMode::Repeat,
            bg_repeat_y: BgRepeatMode::Repeat,
            bg_pos_x: 0.0,
            bg_pos_y: 0.0,
            outline_color: None,
            outline_width: 0,
            outline_offset: 0,
            outline_style: String::from("solid"),
            object_fit: ObjectFit::Fill,
            object_pos_x: 0.5,
            object_pos_y: 0.5,
            filter: String::new(),
            mix_blend_mode: String::new(),
            backdrop_filter: String::new(),
            image_rendering: String::new(),
            text_stroke_width: 0,
            text_stroke_color: None,
            line_clamp: 0,
        }
    }
}

// クリック判定用のリンク座標領域
#[derive(Clone, Debug)]
pub struct HyperlinkArea {
    pub href: String,
    pub x0: i32,
    pub y0: i32,
    pub x1: i32,
    pub y1: i32,
}

// ブラウザエンジン (HTML/CSS レンダラ・DOM操作コア)
#[derive(Clone)]
pub struct DecodedImage {
    pub width: u32,
    pub height: u32,
    pub rgba: alloc::vec::Vec<u8>,
}

pub struct WebEngine {
    /// このエンジン(タブ)の一意 ID。非同期ロードの結果分離に使う。
    pub engine_id: u64,
    pub active: bool,
    pub current_is_https: bool,
    pub current_host: String,
    pub current_path: String,
    /// 現在ページの完全URL（フラグメント #hash を含む）。アンカーナビの
    /// hashchange 発火で oldURL/newURL を組み立てる基準として使う。
    pub current_url_with_hash: String,
    pub title: String,
    pub scroll_y: i32,
    pub max_scroll_y: i32,
    /// `html{scroll-behavior:smooth}` が指定されているか（ルート要素の算出値から判定）。
    /// アンカー/フラグメントナビゲーションのスクロールのみを対象とし、ホイール/スクロール
    /// バードラッグは対象外（実ブラウザでも `scrollIntoView`/アンカー遷移のみが対象）。
    pub scroll_smooth: bool,
    /// `html{scrollbar-width:none}`（CSS Scrollbars Module Level 1。ルート要素の
    /// 算出値から判定する簡略実装で、`scroll-behavior:smooth`と同じ方式）。
    /// `thin`/`auto`は見た目の太さの違いを描画で区別する手段が無いため
    /// 両方とも通常描画（既定太さ）にフォールバックし、`none`のみを
    /// 「非表示」として扱う。丸ごと未対応だった。2026-07-18 発見・実装。
    pub scrollbar_width_none: bool,
    /// スムーススクロール進行中かどうか。
    pub scroll_anim_active: bool,
    pub scroll_anim_from: i32,
    pub scroll_anim_to: i32,
    pub scroll_anim_start_ms: f32,
    /// 【2026-08-03】URL のフラグメント（`#id`）。レイアウト完了後に
    /// 対象要素までスクロールするために保持する。適用したら空にする。
    pub pending_fragment: String,
    pub elements: Vec<RenderElement>,
    /// 【2026-08-01計測】`dirty` を最後に立てた箇所（`ファイル:行`）。
    /// 再描画が毎フレーム走る原因を特定するため。
    pub dirty_reason: &'static str,
    pub links: Vec<HyperlinkArea>,
    pub history: Vec<(bool, String, String)>,
    pub forward_history: Vec<(bool, String, String)>,
    pub dirty: bool,
    pub form_values: alloc::collections::BTreeMap<String, String>,
    /// element_id → HTML 由来の初期値。フォーム reset でこの値へ戻す。
    pub initial_form_values: alloc::collections::BTreeMap<String, String>,
    /// element_id → input の `name` 属性。フォーム送信時のパラメータ名に使う。
    pub field_names: alloc::collections::BTreeMap<String, String>,
    pub dom_contents: alloc::collections::BTreeMap<String, String>,
    pub executing_script: bool,
    /// 次の parse_and_layout で DOM ブリッジを再構築するか（新ページ読込時に true）。
    pub dom_needs_rebuild: bool,
    /// リソース到着による再レイアウトを溜めておく（0 なら保留なし）。
    ///
    /// 【2026-08-05】フォントは 4 並列で 1 本ずつ届くため、
    /// 到着のたびに再レイアウトすると**1 回 4.6 秒**をその回数だけ払う。
    /// 実測では 100 フレーム中 5972 tick（全体の 44%）が
    /// `draw()` 内の再レイアウトだった。
    /// 少し待って**まとめて 1 回**にする。値は最初の到着時刻（tick）。
    pub pending_reflow_since: usize,
    /// 直近の到着時刻（tick）。これが止まったらまとめて実行する。
    pub pending_reflow_last: usize,
    pub focused_id: Option<String>,
    /// フォーカス取得時の入力値（blur 時の change 判定用）。
    pub focus_value: String,
    /// 現在マウスが乗っている要素 id（mouseover/mouseout 判定用）。
    pub hovered_id: Option<String>,
    pub cursor_pos: usize,
    pub env: crate::os_lib::aura::eval::Env,
    /// 組込み JavaScript ランタイム（<script>/onclick を実行）。aura は .aura 用に存続。
    pub js_runtime: crate::os_lib::js::JsRuntime,
    // --- Video Player Animation Fields ---
    pub video_playing: bool,
    pub video_tick: u32,
    // --- Async Loading Animation Fields ---
    /// 背景画像（`background-image`）として参照されている URL の集合。
    /// これらは取得を省略して描画を優先する（`ensure_image_cached` 参照）。
    pub background_image_urls: alloc::collections::BTreeSet<String>,
    pub loading: bool,
    pub loading_tick: u32,
    pub mouse_x: i32,
    pub mouse_y: i32,
    /// 直近の `draw()` 呼び出し時点でマウスが `cursor: text` を持つ要素の上にあったか。
    /// OS 側（`main.rs` の `gui_shell_process`）がマウスカーソルの実描画形状を
    /// 決めるために参照する（`apps::browser::hovered_cursor_is_text()` 経由）。
    pub hovered_cursor_is_text: bool,
    /// CSS `cursor` のキーワード（`"pointer"`/`"grab"`/`"crosshair"` 等）。
    /// ホバー中の要素が持つ `cursor_style` 値をそのまま格納する。
    /// `"text"` は従来どおり `hovered_cursor_is_text` でも判定可能。
    pub hovered_cursor_kind: alloc::string::String,
    /// 前フレームの左ボタン状態。押下/解放のエッジ検出に使う
    /// （on_mouse は WM から毎フレーム現在値で呼ばれるため）。
    pub prev_btn_left: bool,
    /// 現在フレームの左ボタン押下状態（`:active` 疑似クラス判定用。
    /// `is_hovered && mouse_btn_left_down` で押下中の要素を判定する）。
    pub mouse_btn_left_down: bool,
    /// 右ボタンの前フレーム状態（contextmenu の押下エッジ検出用）。
    pub prev_btn_right: bool,
    /// 最後にクリックした要素 id と、その時刻（tick）。dblclick 判定用。
    pub last_click_id: Option<String>,
    pub last_click_tick: usize,
    // --- Window and Editor Scroll / Wrap Fields ---
    pub win_w: u32,
    pub win_h: u32,
    pub top_offset: i32,
    pub editor_wrap: bool,
    pub editor_scroll_y: i32,
    pub editor_scroll_x: i32,
    pub last_html: String,
    pub dragging_scrollbar: bool,
    /// デコード済み画像。`Arc` なのは、JS の `drawImage` から引く
    /// 共有の置き場（`image::shared_image`）と**同じ画素を指す**ため。
    /// 複製すると数 MB の写真を二重に持つことになる。
    pub image_cache:
        alloc::collections::BTreeMap<String, alloc::sync::Arc<DecodedImage>>,
    /// 取得を試みた画像 src（成功・失敗を問わず）。毎フレームの再フェッチ暴走を防ぐ。
    pub image_attempted: alloc::collections::BTreeSet<String>,
    pub active_text_box: Option<crate::kernel::text_box::TextBox>,
    /// `active_text_box` が破棄されても保持し続けるキャレット位置（文字単位）。
    ///
    /// 【2026-09-08 バグ修正】`parse_and_layout` は `active_text_box` を毎回捨てる。
    /// autofocus 付きの入力欄はその直後に再フォーカスされるが、TextBox は
    /// `with_text*()` で作り直されるためカーソルが**末尾へ飛んでいた**。
    /// note アプリの「↑で 1 行しか上がらない」「行の途中で打つと末尾に入る」は
    /// これが原因。再生成時にこの値からキャレットを復元する。
    /// フォーカスが別要素へ移ったときは復元しない（`focus_caret_owner` で判定）。
    pub focus_cursor_pos: usize,
    /// `focus_cursor_pos` がどの element_id のものかを覚えておく。
    pub focus_caret_owner: String,
    /// body/html 要素から取り出したページ背景色（None の場合はデフォルト色を使用）
    pub page_bg_color: Option<u32>,
    /// body/html 要素から取り出したデフォルト文字色
    pub page_text_color: Option<u32>,
    /// CSS アニメーション/トランジション駆動エンジン。
    pub anim_engine: crate::os_lib::css::AnimationEngine,
    /// 直近の parse_and_layout で収集した、id付き要素ごとの (transition 指定, animation 指定)。
    /// element_id → (transition 文字列, animation 文字列)。
    pub anim_specs: alloc::collections::BTreeMap<String, (String, String)>,
    /// element_id → property → 直近の確定値（トランジション開始の from 算出に使う）。
    pub anim_prev_values:
        alloc::collections::BTreeMap<String, alloc::collections::BTreeMap<String, String>>,
    /// アニメ駆動の再レイアウト中は true。この間は sync_animations のトランジション
    /// 検出と prev 更新を抑止し、補間値による逆向きトランジションの誤発火を防ぐ。
    pub in_anim_relayout: bool,
    /// `flatten_layout` 再帰中の「祖先の実効 z」。描画順が祖先を追い越さないよう
    /// 各要素の z をこの値まで引き上げる（`spec/paint_order.md` の不変条件 I-1）。
    pub inherited_paint_z: i32,
    /// `flatten_layout` 再帰中の現在のツリー深さ。`RenderElement::paint_depth` の元。
    pub inherited_paint_depth: u32,
    /// 直近のアニメーション由来 `parse_and_layout` の所要時間 [ms]。
    /// 再レイアウトを実測コストに応じて間引くために使う。
    pub last_anim_layout_ms: f32,
    /// 最後にアニメーション由来の再レイアウトを完了した時刻 [ms]。
    pub last_anim_relayout_end_ms: f32,
    /// サブスクロール領域ごとの現在スクロール量 (element_id → scroll_y)。
    /// overflow:scroll/auto コンテナの独立スクロール位置を保持する。
    pub scroll_regions: alloc::collections::BTreeMap<String, i32>,
    /// サブスクロールバーをドラッグ中のコンテナ ID（None = ドラッグなし）。
    pub dragging_sub_scrollbar: Option<String>,
    /// parse_and_layout で収集したスクロールコンテナのメタ情報。
    /// (element_id, max_scroll_y, content_x, content_y, width, height)
    /// スクロールバー描画とホバー判定に使う。ページ再レイアウトのたびに再構築される。
    pub scroll_containers: alloc::vec::Vec<(String, i32, i32, i32, i32, i32)>,
    /// インクリメンタル再レイアウト用の CSS パースキャッシュ。
    /// 直近にパースした `<style>` 連結文字列をキーに、parse_css 結果を再利用する。
    /// 同一 HTML の再レイアウト（JS による textContent/style 変更など）では
    /// CSS パースを丸ごと省略でき、大きなスタイルシートで効く。
    pub cached_css_key: String,
    /// `cached_css_key` に対応する parse_css 結果。None なら未キャッシュ。
    pub cached_stylesheet: Option<crate::os_lib::css::StyleSheet>,
    /// 外部 `<link rel="stylesheet">` から取得した CSS を連結してキャッシュする
    /// （None = 未取得）。`parse_and_layout` は再レイアウトのたびに呼ばれ得るため、
    /// 毎回フェッチすると致命的に重く（かつ毎フレーム HTTP リクエストになる）、
    /// ここで初回だけ取得して以降は再利用する。ページ遷移時に None へリセットする。
    pub external_css_cache: Option<String>,
}

impl Default for WebEngine {
    fn default() -> Self {
        Self::new()
    }
}

impl WebEngine {
    pub fn new() -> Self {
        let env = crate::os_lib::aura::eval::Env::new();
        let engine_id = {
            let mut g = NEXT_ENGINE_ID.lock();
            let id = *g;
            *g += 1;
            id
        };
        Self {
            dirty_reason: "init",
            pending_fragment: String::new(),
            engine_id,
            active: false,
            current_is_https: true,
            current_host: String::from("lite.duckduckgo.com"),
            current_path: String::from("/"),
            current_url_with_hash: String::from("https://lite.duckduckgo.com/"),
            title: String::from("DuckDuckGo Lite"),
            scroll_y: 0,
            max_scroll_y: 0,
            scroll_smooth: false,
            scrollbar_width_none: false,
            scroll_anim_active: false,
            scroll_anim_from: 0,
            scroll_anim_to: 0,
            scroll_anim_start_ms: 0.0,
            elements: Vec::new(),
            links: Vec::new(),
            history: Vec::new(),
            forward_history: Vec::new(),
            dirty: true,
            form_values: alloc::collections::BTreeMap::new(),
            initial_form_values: alloc::collections::BTreeMap::new(),
            field_names: alloc::collections::BTreeMap::new(),
            dom_contents: alloc::collections::BTreeMap::new(),
            executing_script: false,
            dom_needs_rebuild: false,
            pending_reflow_since: 0,
            pending_reflow_last: 0,
            focused_id: None,
            focus_value: String::new(),
            hovered_id: None,
            cursor_pos: 0,
            env,
            js_runtime: crate::os_lib::js::JsRuntime::new(),
            video_playing: false,
            video_tick: 0,
            background_image_urls: alloc::collections::BTreeSet::new(),
            loading: false,
            loading_tick: 0,
            mouse_x: -1000,
            mouse_y: -1000,
            hovered_cursor_is_text: false,
            hovered_cursor_kind: alloc::string::String::new(),
            prev_btn_left: false,
            mouse_btn_left_down: false,
            prev_btn_right: false,
            last_click_id: None,
            last_click_tick: 0,
            win_w: 1366,
            win_h: 768,
            top_offset: 0,
            editor_wrap: true,
            editor_scroll_y: 0,
            editor_scroll_x: 0,
            last_html: String::new(),
            dragging_scrollbar: false,
            image_cache: alloc::collections::BTreeMap::new(),
            image_attempted: alloc::collections::BTreeSet::new(),
            active_text_box: None,
            focus_cursor_pos: 0,
            focus_caret_owner: String::new(),
            page_bg_color: None,
            page_text_color: None,
            anim_engine: crate::os_lib::css::AnimationEngine::new(),
            anim_specs: alloc::collections::BTreeMap::new(),
            anim_prev_values: alloc::collections::BTreeMap::new(),
            in_anim_relayout: false,
            inherited_paint_z: 0,
            inherited_paint_depth: 0,
            last_anim_layout_ms: 0.0,
            last_anim_relayout_end_ms: 0.0,
            scroll_regions: alloc::collections::BTreeMap::new(),
            dragging_sub_scrollbar: None,
            scroll_containers: alloc::vec::Vec::new(),
            cached_css_key: String::new(),
            cached_stylesheet: None,
            external_css_cache: None,
        }
    }

    fn parse_image_url(url: &str) -> Option<(bool, String, String)> {
        if let Some(rest) = url.strip_prefix("http://") {
            if let Some(idx) = rest.find('/') {
                let (h, p) = rest.split_at(idx);
                let host = String::from(h);
                let path = String::from(p);
                Some((false, host, path))
            } else {
                let host = String::from(rest);
                let path = String::from("/");
                Some((false, host, path))
            }
        } else if let Some(rest) = url.strip_prefix("https://") {
            if let Some(idx) = rest.find('/') {
                let (h, p) = rest.split_at(idx);
                let host = String::from(h);
                let path = String::from(p);
                Some((true, host, path))
            } else {
                let host = String::from(rest);
                let path = String::from("/");
                Some((true, host, path))
            }
        } else {
            None
        }
    }

    /// 画像ロードをノンブロッキングでリクエストする。
    /// キャッシュにあれば即返す。なければバックグラウンドスレッドにキューイングして即return。
    fn ensure_image_cached(&mut self, src: &str) {
        if src.is_empty() {
            return;
        }
        if self.image_cache.contains_key(src) {
            return;
        }
        // 既に取得を試みた src は再フェッチしない（毎フレームの再取得暴走を防止）。
        // デコード失敗（WebP 等の非対応）でも 1 回で打ち切る。
        if self.image_attempted.contains(src) {
            return;
        }
        self.image_attempted.insert(String::from(src));

        let req = if src.starts_with("http://") || src.starts_with("https://") {
            if let Some((is_https, host, path)) = Self::parse_image_url(src) {
                if self.current_is_https && !is_https {
                    crate::warn!(
                        "MIXED CONTENT BLOCKED: Image {} over HTTP in HTTPS page",
                        src
                    );
                    return;
                }
                ImageFetchReq {
                    src_key: String::from(src),
                    is_https,
                    host,
                    path,
                    is_local: false,
                    owner: self.engine_id,
                }
            } else {
                return;
            }
        } else if self.current_host == "localhost" {
            ImageFetchReq {
                src_key: String::from(src),
                is_https: false,
                host: String::new(),
                path: String::from(src),
                is_local: true,
                owner: self.engine_id,
            }
        } else {
            let host = self.current_host.clone();
            let path = if src.starts_with('/') {
                String::from(src)
            } else {
                let base_dir = self
                    .current_path
                    .rfind('/')
                    .map(|i| self.current_path.get(..=i).unwrap_or("/"))
                    .unwrap_or("/");
                let combined = alloc::format!("{}{}", base_dir, src);
                let mut parts: alloc::vec::Vec<&str> = alloc::vec::Vec::new();
                for seg in combined.split('/') {
                    match seg {
                        "" | "." => {}
                        ".." => {
                            parts.pop();
                        }
                        s => parts.push(s),
                    }
                }
                alloc::format!("/{}", parts.join("/"))
            };
            ImageFetchReq {
                src_key: String::from(src),
                is_https: self.current_is_https,
                host,
                path,
                is_local: false,
                owner: self.engine_id,
            }
        };

        enqueue_image(req);
    }

    /// バックグラウンドスレッドが完了した画像を image_cache に取り込む。
    /// 新規取り込みがあった場合 true を返す（再描画が必要）。
    fn poll_image_results(&mut self) -> bool {
        let mut q = IMAGE_QUEUE.lock();
        if q.results.is_empty() {
            return false;
        }
        let results: Vec<(String, DecodedImage)> = core::mem::take(&mut q.results);
        // 取り出したら写しも 0 に戻す（再描画判定はこの写しだけを見る）。
        image::store_results_len(0);
        drop(q);
        for (key, decoded) in results {
            crate::info!(
                "IMAGE_LOADER: decoded '{}' {}x{}",
                key,
                decoded.width,
                decoded.height
            );
            // レイアウトが自然サイズを使えるよう登録する。
            // これが無いと寸法未指定の `<img>` が既定の 400×200 のままになる。
            crate::os_lib::layout::register_image_natural_size(
                &key,
                decoded.width as i32,
                decoded.height as i32,
            );
            let shared = alloc::sync::Arc::new(decoded);
            image::share_image(&key, shared.clone());
            self.image_cache.insert(key, shared);
        }
        true
    }

    // ローカルHTMLファイルを直接パースして表示する処理
    pub fn load_html(&mut self, html: &str, filename: &str, top_offset: i32) {
        self.video_playing = false;
        stop_video_playback();
        self.dom_contents.clear();
        self.dom_needs_rebuild = true;
        // ページ遷移: 外部 CSS キャッシュを破棄し、新ページの <link> を取り直す。
        self.external_css_cache = None;
        // ローカルページへの遷移でも旧ページの画像取得とフォーム値を破棄する。
        IMAGE_QUEUE
            .lock()
            .pending
            .retain(|r| r.owner != self.engine_id);
        self.form_values.clear();
        self.initial_form_values.clear();
        self.field_names.clear();
        self.current_host = String::from("localhost");
        self.current_path = alloc::format!("/{}", filename);
        self.title = alloc::format!("Local: {}", filename);
        // 【2026-07-27診断】ローカルページ読み込み由来の再レイアウト回数。
        {
            static N: core::sync::atomic::AtomicU32 = core::sync::atomic::AtomicU32::new(0);
            let n = N.fetch_add(1, core::sync::atomic::Ordering::Relaxed);
            if n < 8 {
                crate::warn!("[LAYOUT][SRC] load_html('{}') #{}", filename, n + 1);
            }
        }
        self.parse_and_layout(html, None, top_offset, self.win_w, self.win_h);
        self.dirty = true;
        self.dirty_reason = "mod.rs:1432";
    }

    // 現在のURLを取得
    pub fn get_url(&self) -> String {
        let schema = if self.current_is_https {
            "https://"
        } else {
            "http://"
        };
        alloc::format!("{}{}{}", schema, self.current_host, self.current_path)
    }

    // 新しいURL（ホスト＆パス）のロード処理 (非同期化)
    pub fn load_page(
        &mut self,
        is_https: bool,
        host: &str,
        path: &str,
        save_history: bool,
        _top_offset: i32,
    ) {
        self.load_page_with_method(is_https, host, path, save_history, "GET", None);
    }

    pub fn load_page_post(
        &mut self,
        is_https: bool,
        host: &str,
        path: &str,
        body: &str,
        _top_offset: i32,
    ) {
        self.load_page_with_method(is_https, host, path, true, "POST", Some(String::from(body)));
    }

    fn load_page_with_method(
        &mut self,
        is_https: bool,
        host: &str,
        path: &str,
        save_history: bool,
        method: &str,
        body: Option<String>,
    ) {
        // 【2026-08-03】URL のフラグメント（`#id`）を分離して覚えておく。
        //
        // 従来は `#` を含んだままパスとして HTTP 要求に載せており、
        // `https://example.com/#research` のような URL が正しく扱えなかった。
        // フラグメントはサーバへ送るものではなく、
        // **取得後にページ内でスクロールする指定**である。
        // レイアウト完了後に `navigate_to_fragment` で適用する。
        let (path, frag) = match path.split_once('#') {
            Some((p, f)) => (p, String::from(f)),
            None => (path, String::new()),
        };
        let path = if path.is_empty() { "/" } else { path };
        self.pending_fragment = frag;

        self.video_playing = false;
        stop_video_playback();
        self.dom_contents.clear();
        self.dom_needs_rebuild = true;
        // ページ遷移: 外部 CSS キャッシュを破棄し、新ページの <link> を取り直す。
        self.external_css_cache = None;
        // ページ遷移: 旧ページの未処理画像ダウンロードを破棄する。
        // これをしないと、遷移後も旧ページの画像取得が延々と続き OS 全体が重くなる。
        IMAGE_QUEUE
            .lock()
            .pending
            .retain(|r| r.owner != self.engine_id);
        // 旧ページのフォーム入力値・name マッピングは次ページへ持ち越さない。
        self.form_values.clear();
        self.initial_form_values.clear();
        self.field_names.clear();
        if save_history {
            self.history.push((
                self.current_is_https,
                self.current_host.clone(),
                self.current_path.clone(),
            ));
            self.forward_history.clear();
        }

        if host == "localhost" {
            self.current_is_https = false;
            self.current_host = String::from("localhost");
            self.current_path = String::from(path);
            self.current_url_with_hash = alloc::format!("http://localhost{}", path);

            let clean_path = path.strip_prefix('/').unwrap_or(path);
            if clean_path == "home" || clean_path.is_empty() {
                self.title = String::from("AtmOS Browser");
                let html = HOME_HTML;
                self.parse_and_layout(html, None, self.top_offset, self.win_w, self.win_h);
                self.dirty = true;
                self.dirty_reason = "mod.rs:1513";
            } else {
                let actual_path = if path.starts_with('/') {
                    String::from(path)
                } else {
                    alloc::format!("/{}", path)
                };
                // 【2026-08-25 バグ修正】以前は `FS_LOCK` を保持したまま
                // `parse_and_layout()` を呼んでいた。
                //
                // レイアウトは `<img>` の寸法解決（`get_replaced_element_size`）
                // から FS を読み、JS は `localStorage` の書き出しから FS を書く。
                // どちらも `FS_LOCK` を取るが、`spin::Mutex` は**再入できない**。
                // つまり画像 1 枚あるローカルページを開くだけで自分自身と
                // 取り合って固まる。ロックの保持時間が長いほど、
                // 「保持中に何を呼んでいるか」が見えなくなる。
                //
                // **読み込みだけを番人の下に置き、レイアウトは外へ出す**。
                let loaded = {
                    let _fs_guard = crate::kernel::fs::FS_LOCK.lock();
                    crate::kernel::fs::get_fs().read_file(&actual_path)
                };
                if let Some((_meta, content)) = loaded {
                    if let Ok(html) = core::str::from_utf8(&content) {
                        self.title = alloc::format!("Local: {}", clean_path);
                        self.parse_and_layout(html, None, self.top_offset, self.win_w, self.win_h);
                        self.dirty = true;
                        self.dirty_reason = "mod.rs:1525";
                    } else {
                        let err_html = alloc::format!("<html><title>Load Error</title><body style=\"background-color: #282a36; color: #ff5555;\"><h1>UTF-8 Decode Failed</h1><p>File '{}' is not valid UTF-8.</p></body></html>", actual_path);
                        self.title = String::from("Load Error");
                        self.parse_and_layout(&err_html, None, self.top_offset, self.win_w, self.win_h);
                        self.dirty = true;
                        self.dirty_reason = "mod.rs:1530";
                    }
                } else {
                    let err_html = alloc::format!("<html><title>Not Found</title><body style=\"background-color: #282a36; color: #ff5555;\"><h1>404 Not Found</h1><p>Local file '{}' not found in SylFS.</p></body></html>", actual_path);
                    self.title = String::from("404 Not Found");
                    self.parse_and_layout(&err_html, None, self.top_offset, self.win_w, self.win_h);
                    self.dirty = true;
                    self.dirty_reason = "mod.rs:1536";
                }
            }
            return;
        }

        self.current_is_https = is_https;
        self.current_host = String::from(host);
        self.current_path = String::from(path);
        // 新ページ読込でフラグメントはリセット（アンカーナビの hashchange 基準を同期）。
        let scheme0 = if is_https { "https://" } else { "http://" };
        self.current_url_with_hash = alloc::format!("{}{}{}", scheme0, host, path);

        let schema = if is_https { "https://" } else { "http://" };
        crate::info!(
            "BROWSER: Loading page {} {}{}{} (Async)",
            method,
            schema,
            host,
            path
        );

        self.loading = true;
        self.loading_tick = 0;

        let req = AsyncLoadRequest {
            owner: self.engine_id,
            is_https,
            host: String::from(host),
            path: String::from(path),
            method: String::from(method),
            body,
            status: 1, // 処理中
            result_body: None,
            result_dom: None,
            error_msg: None,
        };

        let need_spawn = {
            let mut lock = ASYNC_LOAD.lock();
            // 同じタブの未消費リクエストは置換（連続ナビゲーションで古い結果を捨てる）
            lock.requests.retain(|r| r.owner != self.engine_id);
            lock.requests.push(req);
            if !lock.thread_active {
                lock.thread_active = true;
                true
            } else {
                false
            }
        };

        // ローダースレッドが止まっている時だけ起動（多重起動を防ぐ）
        if need_spawn {
            // 【2026-08-05 バグ修正】`spawn` はヒープ不足で **0 を返す**。
            // `thread_active = true` を先に立てているので、失敗したまま
            // 戻さないと「ローダーは居ないのに稼働中」になり、
            // **以後メイン HTML の読み込みが永久に始まらない**
            // （`need_spawn` が二度と真にならない）。
            let pid = crate::kernel::scheduler::spawn(
                async_load_thread_entry,
                crate::kernel::scheduler::Priority::High,
                "browser_loader",
            );
            if pid == 0 {
                crate::warn!("[NET] ローダースレッドを起動できません（ヒープ不足）");
                ASYNC_LOAD.lock().thread_active = false;
            }
        }
        self.dirty = true;
        self.dirty_reason = "mod.rs:1595";
    }

    pub fn set_dom_content(&mut self, id: &str, val: &str) {
        self.dom_contents
            .insert(String::from(id), String::from(val));
        let html = self.last_html.clone();
        let top_offset = self.top_offset;
        let win_w = self.win_w;
        let win_h = self.win_h;
        self.parse_and_layout(&html, None, top_offset, win_w, win_h);
        self.dirty = true;
        self.dirty_reason = "mod.rs:1606";
    }

    // 戻るボタンの処理
    pub fn go_back(&mut self, _top_offset: i32) {
        // SPA pushState で積んだ履歴を優先して戻る（ページリロードなし）。
        if self.js_runtime.has_spa_back() {
            if let Some(url) = self.js_runtime.spa_go_back() {
                // URL からホスト/パスを更新して表示を合わせる（リロードはしない）。
                let (is_https, host, path) = self.resolve_url_parts(&url);
                self.current_is_https = is_https;
                self.current_host = host;
                self.current_path = path;
                self.dirty = true;
                self.dirty_reason = "mod.rs:1619";
            }
            return;
        }
        // 実ページ遷移の履歴から戻る。
        if let Some((prev_is_https, prev_host, prev_path)) = self.history.pop() {
            self.forward_history.push((
                self.current_is_https,
                self.current_host.clone(),
                self.current_path.clone(),
            ));
            self.load_page_with_method(prev_is_https, &prev_host, &prev_path, false, "GET", None);
        }
    }

    pub fn go_forward(&mut self, _top_offset: i32) {
        // SPA forward 履歴を優先して進む。
        if self.js_runtime.has_spa_forward() {
            if let Some(url) = self.js_runtime.spa_go_forward() {
                let (is_https, host, path) = self.resolve_url_parts(&url);
                self.current_is_https = is_https;
                self.current_host = host;
                self.current_path = path;
                self.dirty = true;
                self.dirty_reason = "mod.rs:1642";
            }
            return;
        }
        // 実ページ遷移の forward 履歴から進む。
        if let Some((fwd_is_https, fwd_host, fwd_path)) = self.forward_history.pop() {
            self.history.push((
                self.current_is_https,
                self.current_host.clone(),
                self.current_path.clone(),
            ));
            self.load_page_with_method(fwd_is_https, &fwd_host, &fwd_path, false, "GET", None);
        }
    }

    /// JS の form.reset() が積んだリセット要求を処理する。JS 実行後にホストが呼ぶ。
    /// 戻り値: 実際にリセットしたか。
    pub fn process_pending_reset(&mut self) -> bool {
        match self.js_runtime.take_pending_reset() {
            Some(fi) => {
                self.reset_form_node(fi);
                true
            }
            None => false,
        }
    }

    pub fn can_go_back(&self) -> bool {
        !self.history.is_empty()
    }
    pub fn can_go_forward(&self) -> bool {
        !self.forward_history.is_empty()
    }

    /// JS の history.back/forward/go() が積んだナビゲーション要求を処理する。
    /// JS 実行（onclick / イベントリスナ）後にホストが呼ぶ。実ナビ後に popstate を発火。
    /// 戻り値: 実際にナビゲートしたか（呼び元がアドレスバー更新等に使う）。
    pub fn process_pending_nav(&mut self, top_offset: i32) -> bool {
        let delta = self.js_runtime.take_pending_nav();
        if delta == 0 {
            return false;
        }
        let mut navigated = false;
        if delta < 0 {
            for _ in 0..(-delta) {
                if !self.can_go_back() {
                    break;
                }
                self.go_back(top_offset);
                navigated = true;
            }
        } else {
            for _ in 0..delta {
                if !self.can_go_forward() {
                    break;
                }
                self.go_forward(top_offset);
                navigated = true;
            }
        }
        if navigated {
            // 新ページURLを JS の location に反映してから popstate を発火。
            let url = self.get_url();
            self.js_runtime.set_page_url(&url);
            self.js_runtime.fire_popstate();
        }
        navigated
    }

    /// location への代入や assign/replace/reload が積んだナビゲーション要求を処理する。
    /// ホストが JS 実行後（on_mouse / on_key / タイマ後など）に呼ぶ。戻り値は遷移したか否か。
    pub fn process_pending_location(&mut self, top_offset: i32) -> bool {
        let req = self.js_runtime.take_pending_location();
        let (url, mode) = match req {
            Some(v) => v,
            None => return false,
        };
        match mode.as_str() {
            // 同一ページ内フラグメント。フルリロードせず hashchange 経路へ。
            "hash" => {
                let frag = match url.split_once('#') {
                    Some((_, f)) => alloc::format!("#{}", f),
                    None => String::from("#"),
                };
                self.navigate_to_fragment(&frag);
                true
            }
            // 履歴を置換して遷移（save_history=false）。
            "replace" => {
                let (is_https, host, path) = self.resolve_url_parts(&url);
                self.load_page(is_https, &host, &path, false, top_offset);
                let new_url = self.get_url();
                self.js_runtime.set_page_url(&new_url);
                true
            }
            // 現在ページの再読込。
            "reload" => {
                let is_https = self.current_is_https;
                let host = self.current_host.clone();
                let path = self.current_path.clone();
                self.load_page(is_https, &host, &path, false, top_offset);
                true
            }
            // 通常の遷移（履歴に積む）。href 代入 / assign(url)。
            _ => {
                self.navigate_to_href(&url, top_offset);
                let new_url = self.get_url();
                self.js_runtime.set_page_url(&new_url);
                true
            }
        }
    }
}