<section class="view home-view" data-view="home">
  <header class="shell-topbar">
    <div class="shell-topbar-content">
      <p class="shell-brand">Nebula OS</p>
      <div class="shell-status">
        <span class="shell-avatar" aria-hidden="true"></span>
        <p class="shell-time" data-clock>--:--</p>
      </div>
    </div>
    <div class="shell-accent-line"></div>
  </header>

  <section class="home-hero">
    <p class="muted">Dashboard</p>
    <h1 class="view-title">Jump back in</h1>
  </section>

  <section class="tile-rail" data-focus-root data-home-rail>
    <button class="focusable tile dashboard-tile tile-large" data-focusable="true" data-row="0" data-col="0" data-target="library">
      <div class="tile-content">
        <span class="tile-icon" aria-hidden="true">📚</span>
        <div class="tile-text">
          <p class="tile-label">Library</p>
          <p class="tile-meta">Your games & apps</p>
        </div>
      </div>
      <div class="tile-accent-bar"></div>
    </button>
    <button class="focusable tile dashboard-tile" data-focusable="true" data-row="0" data-col="1" data-target="browser">
      <div class="tile-content">
        <span class="tile-icon" aria-hidden="true">🌐</span>
        <div class="tile-text">
          <p class="tile-label">Browser</p>
          <p class="tile-meta">Explore the web</p>
        </div>
      </div>
      <div class="tile-accent-bar"></div>
    </button>
    <button class="focusable tile dashboard-tile" data-focusable="true" data-row="0" data-col="2" data-target="settings">
      <div class="tile-content">
        <span class="tile-icon" aria-hidden="true">⚙️</span>
        <div class="tile-text">
          <p class="tile-label">Settings</p>
          <p class="tile-meta">System configuration</p>
        </div>
      </div>
      <div class="tile-accent-bar"></div>
    </button>
    <button class="focusable tile dashboard-tile" data-focusable="true" data-row="0" data-col="3" data-target="power">
      <div class="tile-content">
        <span class="tile-icon" aria-hidden="true">⏻</span>
        <div class="tile-text">
          <p class="tile-label">Power</p>
          <p class="tile-meta">Sleep, restart, shut down</p>
        </div>
      </div>
      <div class="tile-accent-bar"></div>
    </button>
  </section>
</section>
